vue 组件父向子绑定传输数据问题

Question

 <test v-for="(item,index) in prolist" v-bind:res="item" :index="index"></test>
 var comp = {
            template: "<p id="getid(index)">{{res.F_Id}}</p>",
            props: ['res', 'index'],
            methods: {
              getid:function(index){
return "pro_"+index;
}
            }
        }
如何把组件传过去的index 绑定到模板里 p标签的id ？怎么写求教

Answer 1

template: "<p id={{getid(index)}}>{{res.F_Id}}</p>"

Answer 2

这样好点：
var comp = {
            template: "<p :id=“getid”>{{res.F_Id}}</p>",
            props: ['res', 'index'],
            datas: function () {
              return {
                 getid:function(){
                    return "pro_"+this.index;
                }
            }
        }

Answer 3

哦 我傻逼了 应该是这样var comp = {
            template: "<p :id=“getid”>{{res.F_Id}}</p>",
            props: ['res', 'index'],
            computed: {
               function () {
                return {
                   getid:function(){
                      return "pro_"+this.index;
                  }
              }
            }
        }

Answer 4

以这个为准
var comp = {
            template: "<p :id=“getid”>{{res.F_Id}}</p>",
            props: ['res', 'index'],
            computed: {
              getid: function () {
                return "pro_"+this.index;
              }
            }
}

Answer 5

还是谢谢你，经过你的启发我发现问题了。要写在计算属性里computed 才行 ，methods里是不行的。你上面那个写法好像调试也不行哦哈哈
  var comp = {
            template: "<p :id='getid'>{{res.F_Id}}</p>",
            props: ['res', 'index'],
            computed: {
                        getid: function () {
                            return "pro_" + this.index;
                        }
            }
        }

Answer 6

不用这么复杂<div id="app">
    <test v-for="(item,index) in prolist" :res="item" :index="index"></test>
</div>
<script>
    Vue.component('test', {
        template: "<p :id='\"pro_\"+index'>{{res.F_Id}}</p>",
        props: ['res', 'index']
    })
    var app = new Vue({
        el: '#app',
        data: {
            prolist: [{F_Id:'A'},{F_Id:'B'}]
        }
    })
</script>

Answer 7

还是谢谢你，经过你的启发我发现问题了。要写在计算属性里computed 才行 ，methods里是不行的。你上面那个写法好像调试也不行哦哈哈
  var comp = {
            template: "<p :id='getid'>{{res.F_Id}}</p>",
            props: ['res', 'index'],
            computed: {
                        getid: function () {
                            return "pro_" + this.index;
                        }
            }
        }谢谢老哥。这个更简洁了

Answer 8

`prop_${index}`