質問編集履歴
1
ソースコードを修正しました。
title
CHANGED
File without changes
|
body
CHANGED
@@ -62,7 +62,7 @@
|
|
62
62
|
detailSelect: '事務所用のもの',
|
63
63
|
items: [
|
64
64
|
{ id: 0, name: '建物', types: [
|
65
|
-
{ use: '木造・合成樹脂造のもの', details: [
|
65
|
+
{ tId: 0, use: '木造・合成樹脂造のもの', details: [
|
66
66
|
{label: '事務所用のもの', life: 24 },
|
67
67
|
{label: '店舗用・住宅用のもの', life: 22 },
|
68
68
|
{label: '飲食店用のもの', life: 20 },
|
@@ -70,7 +70,7 @@
|
|
70
70
|
{label: '公衆浴場用のもの', life: 12 },
|
71
71
|
{label: '工場用・倉庫用のもの(一般用)', life: 15 },
|
72
72
|
]},
|
73
|
-
{ use: '木骨モルタル造のもの', details: [
|
73
|
+
{ tId: 1, use: '木骨モルタル造のもの', details: [
|
74
74
|
{label: '事務所用のもの', life: 22 },
|
75
75
|
{label: '店舗用・住宅用のもの', life: 20 },
|
76
76
|
{label: '飲食店用のもの', life: 19 },
|
@@ -80,12 +80,12 @@
|
|
80
80
|
]},
|
81
81
|
]},
|
82
82
|
{ id: 1, name: '建物附属設備', types: [
|
83
|
-
{ use: 'アーケード・日よけ設備', details: [
|
83
|
+
{ tId: 0, use: 'アーケード・日よけ設備', details: [
|
84
84
|
{label: '主として金属製のもの', life: 15 },
|
85
85
|
{label: 'その他のもの', life: 8 },
|
86
86
|
]},
|
87
|
-
{ use: '店舗簡易装備', details: [
|
87
|
+
{ tId: 1, use: '店舗簡易装備', details: [
|
88
|
-
{label: '', life: 3 },
|
88
|
+
{label: 'aaa', life: 3 },
|
89
89
|
]},
|
90
90
|
]},
|
91
91
|
],
|
@@ -93,28 +93,39 @@
|
|
93
93
|
},
|
94
94
|
computed: {
|
95
95
|
getTypes: function() {
|
96
|
-
|
96
|
+
// 選択中の情報を取得
|
97
|
-
|
97
|
+
let itemName = this.itemSelect; // 1つ目のselect
|
98
98
|
|
99
|
-
|
99
|
+
// items から選択中のnameを探す
|
100
|
-
|
100
|
+
const itemResult = this.items.find((v) => v.name === itemName);
|
101
101
|
|
102
|
-
|
102
|
+
// 2つ目のselectの初期値をセットする
|
103
|
-
|
103
|
+
this.typeSelect = this.items[itemResult.id].types[0].use;
|
104
|
+
|
105
|
+
// 2つ目のselectのoptionをセットする
|
104
|
-
|
106
|
+
return this.items[itemResult.id].types;
|
105
|
-
|
107
|
+
},
|
106
|
-
|
108
|
+
getDetails: function() {
|
107
|
-
|
109
|
+
// 選択中の情報を取得
|
110
|
+
let itemName = this.itemSelect; // 1つ目のselect
|
108
|
-
|
111
|
+
let typeName = this.typeSelect; // 2つ目のselect
|
109
|
-
|
112
|
+
|
110
|
-
|
113
|
+
// items から選択中のuseを探す
|
114
|
+
const itemResult = this.items.find((v) => v.name === itemName);
|
111
|
-
|
115
|
+
const typeResult = this.items[itemResult.id].types.find((v) => v.use === typeName);
|
116
|
+
|
117
|
+
// 3つ目のselectの初期値をセットする
|
112
|
-
|
118
|
+
console.log(this.items[itemResult.id].types[typeResult.tId].details[0].label);
|
119
|
+
this.detailSelect = this.items[itemResult.id].types[typeResult.tId].details[0].label;
|
120
|
+
|
113
|
-
|
121
|
+
// 3つ目のselectのoptionをセットする
|
122
|
+
return this.items[itemResult.id].types[typeResult.tId].details;
|
123
|
+
|
114
|
-
|
124
|
+
}
|
115
125
|
},
|
116
126
|
});
|
117
127
|
```
|
118
128
|
|
119
|
-
|
129
|
+
3つ目のselectの初期値、及び3つ目のselectのoptionが、セットされません。
|
130
|
+
|
120
131
|
どうぞ、よろしくお願いいたします。
|