Vue项目开发中问题随笔：

业务逻辑是这样的，在iView的table组件数据列表每行添加单选按钮后要绑定ref操作，ref的名字是radio加入id，获取ref时发现的小问题。

下面贴出解决方法，记录一下

通过ivew的文档提供的方法，给Table 绑定点击行触发事件@on-row-click="rowClick"。

<Table ref="tableTitle" @on-row-click="rowClick" :columns="hotField" :data="hotProItem">

    <template slot-scope="{ row, index }" slot="select">

          <div :ref="`radio${row.id}`" ></div>

    </template>

</Table>

最开始测试了下，能打印出来想要的ref名字，打印this.$refs也可以看见想要的名字

rowClick(rowItem){

    const radioItem = `radio${ rowItem .id}`

    console.log(radioItem);

    console.log(this.$refs);

},

打印如下：

所以就天真的写上了console.log(this.$refs.radioItem)，结果输出了undefined。

解决方法：

rowClick(rowItem){

    console.log( this.$refs[`radio${rowItem.id}`] ); 

}, 

可以正常拿到了点击某行的那个ref了。