前提・実現したいこと
vue,jsを勉強中です。
axiosで以下のような二次配列を取得しました。
[["佐藤","@sato"],["中山","@nakayama"],["福田","@fukuda"],]
これらの値をv-forにて別々に吐き出したいのですが、
その方法がよくわかりません。
理想としては
<input type="checkbox" id="mention" class="sec_staffSelect--chkBox" name="color">' + <span class="sec_staffSelect--staffNam" v-text="name" ></span>' +
上記のように別々のタグに値を入れたいです
該当のソースコード
window.onload = function () { new Vue({ el: '#names', data: { info: { name: [], mention: [] } }, template: '<ul class="sec_staffSelect--staffUi" >' + ' <li class="sec_staffSelect--staffli" v-for="name in names">' + ' <label class="sec_staffSelect--staffLabel">' + ' <input type="checkbox" class="sec_staffSelect--chkBox" name="color">' + ' <span class="sec_staffSelect--staffNam" v-text="name" ></span>' + ' </label>' + ' </li>' + '</ul>', created: function () { const self = this return axios.get('url') .then(response => { self.info = response.data for (let i = 0, len = self.info.length; i < len; ++i) { console.log(self.info[i][0]) this.names.push(self.info[i][0]) } }).catch(err => { console.log('err:', err) }) } }) }
試したこと
cratedの部分でpushをして配列に値を加える。
よろしくお願いします
回答1件
あなたの回答
tips
プレビュー