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

[u011080240]

 <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 ？怎么写求教

[scscms太阳光]

不用这么复杂

<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>

[u011080240]

引用 5 楼 讨厌走开啦 的回复:

哦 我傻逼了 应该是这样

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

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

引用 8 楼 scscms太阳光 的回复:

不用这么复杂

<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>

谢谢老哥。这个更简洁了

[讨厌走开啦]

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

[讨厌走开啦]

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

[u011080240]

引用 2 楼 讨厌走开啦 的回复:

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

这样写不对吧？不行哦

[讨厌走开啦]

引用 3 楼 u011080240 的回复:

[quote=引用 2 楼 讨厌走开啦 的回复:] 这样好点： var comp = { template: "<p :id=“getid”>{{res.F_Id}}</p>", props: ['res', 'index'], datas: function () { return { getid:function(){ return "pro_"+this.index; } } }

这样写不对吧？不行哦[/quote] 哪里不对？

[讨厌走开啦]

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

[讨厌走开啦]

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

[u011080240]

引用 5 楼 讨厌走开啦 的回复:

哦 我傻逼了 应该是这样

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

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

[总管陈好人]

`prop_${index}`