반응형
네트워크에서 가져온 개체에 v-bind:value 또는 v-model을 사용할 수 있는가?
하고 싶다.VueApp
사용하다v-model
또는v-bind:value
에서 얻은 목적 때문에network api
.
예를 들어,Vue app
으로부터 목적을 얻다api
이것처럼.
{
field1:value1, field2:value2, ......... , field100:value100
}
밭의 수가 많다.
사용 방법v-model='obj.field'
, 나는 생각한다.Vue app
데이터를 다음과 같이 정의해야 한다.
new Vue({
el:"#mainapp",
data:{
obj:{field:''}
}
...
}
내가 사용해도 될까?v-model
그 목적을 위해api
의 분야에 대한 정의 없이object
에vue app data
?
필자에게 이것이 필요한 주된 이유는 필드의 수가 많고, 필드의 모든 필드가 존재하는지 확신할 수 없었기 때문이다.obj
. (좋다)field99
아래 예에서)
사물의 모든 분야를 정의해야 할 것 같아obj
에vue app data
나쁜 경험이다.
내가 원하는 예.
//script
new Vue({
el:"#mainapp",
data:{
obj:{}
},
created(){
this.$http.get('urltoget_object')
.then((res)=>{
this.obj = res.body.data; //this returns object by data field.
}, (err)=>{});
}
...
}
<input type='text' v-model= 'obj.field100' />
<input type='text' v-model= 'obj.field99.netstedfield' />
내가 어떻게 이 목표를 달성할 수 있을까?
remote api에서 데이터를 가져온 후 데이터를 설정하고, 이를 사용하여 응답하십시오.$set.
//script
new Vue({
el:"#mainapp",
data:{
obj:{}
},
created(){
this.$http.get('urltoget_object')
.then((res)=>{
this.obj = res.body.data; //this returns object by data field.
this.$set(this,'obj',res.body.data)
}, (err)=>{});
}
...
}
<input v-if="'field100' in obj" type='text' v-model= 'obj.field100' />
반응형
'programing' 카테고리의 다른 글
C와 C++에서 사용되는 다른 버전의 Exec은 무엇인가? (0) | 2022.05.14 |
---|---|
정수.valueOf() 대정수.parseInt() (0) | 2022.05.14 |
Vuex4에 있는 소방시설에서 스냅샷을 올바르게 사용하는 방법 (0) | 2022.05.14 |
새로운 Nuxt js 프로젝트를 만들려고 할 때 일부 디렉토리가 누락됨 (0) | 2022.05.14 |
Vue js 라우터: 클릭 이벤트에서 URL 쿼리를 변경하거나 업데이트하는 방법 (0) | 2022.05.14 |