如何将属性传递给kebab-case属性？

Question

这里是一个简单的组件： jsFiddle

Vue.component('hello', { 
     props : ['personName'], 
    render : function(createElement) { 
     var self = this 
     return createElement("span", "Hello " + self.personName) 
    } 
}) 

new Vue({ 
    el: '#app', 
    data : { 
     name : 'Jobs' 
    } 
}) 

现在，我想引用该组件如下：

<hello person-name="Steve"></hello> // works 
    <hello person-name="{{name}}"></hello> // now working 

我知道V-结合的作品，在的情况下，任何的提示{ {名称}}？感谢

Answer 1

你可以有变量通过使用属性绑定传递的道具或其他属性数据属性：

<component :prop-name='value' /> 

其中:prop-name是属性结合短手语法。

1. 属性与:即属性约束的属性，可以访问vue实例data性能，methods，computed性质。另一方面，Vue Directives直接使用vue实例变量而不需要属性绑定。像：

   v-if='val > 0' 
   

与您的组件设置，如：

export default { 
    data() { 
    return { 
     val: '0' 
    } 
    } 
} 

Your posted code