演示:

圖中, 選中這行數據后, 怎么獲取到當前的數據?

代碼:

<tr v-for="item in gridData"><td><input type="radio" v-model="checkout" @change="getDateFn" :data-type="item.articleType" :data-channelName="item.channelName" :data-channelId="item.channelId" :data-code="item.oneline_news_code" :value="item.id || item.articleId"/> </td>

回答:

代碼中可以看到, tr中已經使用v-for對gridData數據進行了循環遍歷,

下面的radio中,

我們使用:data-channelName='item.channelName', 自己定義了一個data-channelName字段,

通過這個字段獲取和存儲當前item中的channelName字段,

然后在getDateFn方法中,

我們使用$event.target.getAttribute('data-channelName');

將上面:data-channeName存儲的數據賦值給 this.channelName.

getDateFn($event) {window.myArticle_type = $event.target.getAttribute('data-type');if($event.target.getAttribute('data-code')){window.myOneline_news_code = $event.target.getAttribute('data-code');}console.log($event.target.getAttribute('data-code'))// 存儲 item.channelNamethis.channelName = $event.target.getAttribute('data-channelName');// 存儲 item.channelIdthis.channelId = $event.target.getAttribute('data-channelId');