Q&A
実現したいこと
- 連想配列の値をinput type="select"属性に選択肢として登録したい
前提
Vue2,nuxt.jsでフォームを作成しています
動的に選択肢が入れ替わるようにしたい
発生している問題・エラーメッセージ
Object.entriesにてkeyとvalueにそれぞれ登録しようとしましたが
Object.entries自体が動いていないように思います
Cannot convert undefined or null to object
該当のソースコード
vue.js
1<template> 2// ここで選んだ選択肢によって次の選択肢を入れ替えたい 3<Input 4 v-model="nums" 5 input-type="select" 6 :options="[0,1,2]" 7/> 8 9// ここの選択肢を動的にしたいです 10<Input 11 input-type="select" 12 :options="setSelect(object1[nums])" 13/> 14 15</template> 16//このオブジェクトをselectの選択肢に追加したい 17const object1 = 18[{"aa":"値1","bb":"値2","cc":"値3","dd":"値4","ee":"値5"}], 19[{"aa":"値1","bb":"値2","cc":"値3","dd":"値4","ee":"値5"}], 20[{"aa":"値1","bb":"値2","cc":"値3","dd":"値4","ee":"値5"}] 21 22 23methods(){ 24 setSelect(object1){ 25 for (const [key, value] of Object.entries(object1)) { 26 console.log(`${key}: ${value}`); 27 } 28 } 29}
試したこと
下記で選択肢に入れようともしましたが
Cannot read properties of undefined(reading 'map')と表示されエラーになってしまいます
vue.js
1setSelect(object1){ 2 const array = object1.map((d,idx) => { 3 return { 4 key:idx, 5 value:d.value, 6 } 7 }) 8}
補足情報(FW/ツールのバージョンなど)
vue2 nuxt2.6.1を使用
回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。