반응형

vuejs2 87

어레이의 개체를 변경하고 반응성을 트리거합니다.

어레이의 개체를 변경하고 반응성을 트리거합니다. 배열에서 인덱스로 발견된 개체의 일부를 변경할 때 업데이트를 트리거하려면 어떻게 해야 합니까? 문서에서는 배열 값을 변경하는 방법을 보여 줍니다. Vue.set(example1.items, indexOfItem, newValue) 또는 example1.items.splice(indexOfItem, 1, newValue) 그러나 개체의 나머지 부분을 변경하지 않고 배열에 있는 개체의 속성 값을 변경하려면 어떻게 해야 합니까? 다음은 속성을 업데이트하기 위해 작동하지만 Vue는 다른 항목이 업데이트를 트리거할 때까지 변경에 응답하지 않습니다. example1.items[indexOfItem].some_object_property = false 어레이 요소의 하..

itsource 2022.07.21

Quasar로 마이크로 프런트엔드를 구축하는 방법

Quasar로 마이크로 프런트엔드를 구축하는 방법 마이크로 프런트엔드와 마이크로 서비스 개념을 현재 프로젝트에 적용하려고 합니다. 프런트 엔드 개발에는 https://backendar.dev/ 및 backend https://www.scala-lang.org/ 를 사용하고 있습니다. 다음과 같은 시나리오가 있습니다. 저는 3개의 마이크로 서비스를 가지고 있으며 각각 NGINX 컨테이너 내에서 실행되는 프런트엔드가 있습니다.또한 모든 마이크로 서비스에는 자체 백엔드가 있으며 스칼라로 작성되어 있습니다. 이제 제가 달성하고자 하는 것은 다음과 같습니다. URL example.io/app1, 를 입력하면 microservice1 이 호출됩니다.App Shell의 내용(파란색 테두리가 있는 직각)은 micros..

itsource 2022.07.21

vue.js의 하위 구성 요소에 데이터를 전달하는 방법

vue.js의 하위 구성 요소에 데이터를 전달하는 방법 vue.js는 처음이며 하위 구성 요소에 값을 전달하려고 합니다. HTML JS Vue.component('my-component', { props: ['data'], template: 'Parent component with data: {{ data.value }}!' }); Vue.component('my-component-child', { props: ['data'], template: 'Child component with data: {{ data.value }} ' }); new Vue({ el: '#example', data: { parentData: { value: 'hello parent!' }, childData: { value: '..

itsource 2022.07.21

Vue.js - 개체를 다른 데이터 속성에 '복사'할 때 바인딩하지 않음

Vue.js - 개체를 다른 데이터 속성에 '복사'할 때 바인딩하지 않음 API에서 오브젝트를 가져오고 있는데 모달 로드 시 오브젝트를 다른 오브젝트로 '복제'해야 합니다. 이 방법은 다음과 같습니다. this.servicesForm.services = this.team.services; // New object // API object 지금 문제는 내가 그 팀을 원하지 않는다는 것이다.servicesForm.services 개체를 업데이트할 때 바인딩되어 업데이트되는 services 개체입니다. 그걸 어떻게 하는 거죠?내 답을 빠르게 찾았다: this.servicesForm.services = JSON.parse(JSON.stringify(this.team.services)); ES6 솔루션은 Obje..

itsource 2022.07.21

v-for prop 값이 부트스트랩 모달로 업데이트되지 않음

v-for prop 값이 부트스트랩 모달로 업데이트되지 않음 다음과 같은 코드 조각이 있습니다. 제가 직면한 문제는 소품에서 항상 첫 번째 가치를 얻고 있다는 것입니다.제가 여기서 뭘 잘못하고 있는지 알려주실 수 있나요?vuejs 2.0을 사용하고 있다 또, 자 컴포넌트의 소품을 프로그래밍 방식으로 설정할 수 있습니까? 내 자식 구성요소는 다음과 같습니다. {{currentevent.title}} New Event Close Save 이벤트(반복 중)... 이벤트(애플리케이션의 컨텍스트)는 Google 이벤트와 마찬가지로 발생하는 것입니다.사용자는 이벤트를 만들고 해당 이벤트를 일정관리 컨트롤에 렌더링합니다. 현재 시스템에는 3개의 이벤트가 있습니다.모두 여기에 나열되어 있습니다.또한 v-for의 "이벤..

itsource 2022.07.17

Vuex를 통한 양방향 데이터 바인딩

Vuex를 통한 양방향 데이터 바인딩 아래 코드에서는 텍스트 영역의 출력을 p 요소로 양방향 바인딩합니다.하나는 컴포넌트의 내부 상태에서, 다른 하나는 Vuex에서.Vuex 상태에는 초기값이 표시되지만 텍스트를 추가하거나 삭제해도 값이 업데이트되지 않습니다(내부 데이터에 바인딩된 첫 번째 텍스트 영역과 마찬가지로 올바르게 업데이트되지 않습니다.이 문제의 원인은 무엇입니까? 컴포넌트 코드: {{ internal_state }} {{ this.$store.state.vuex_state }} Vuex 코드: import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export const store = new Vuex.Store({ strict: true, st..

itsource 2022.07.17

VueJ: v-model과 :value를 동시에 사용

VueJ: v-model과 :value를 동시에 사용 사용할 방법을 찾고 있습니다.v-model그리고.:value같은 시간에 같은 물체에서. 다음 오류가 발생하였습니다. :value="user.firstName"와의 충돌.v-model후자는 이미 내부적으로 값 바인딩으로 확장되어 있기 때문에 동일한 요소에서 사용할 수 있습니다. 목적은 이 값을 디폴트 값으로 설정하는 것입니다.mapGetters(한 스토어에서 가져온다) 및 사용자가 수정 내용을 제출할 시기를 올바르게 설정합니다.(인onSubmit) {{ $t("firstname") }} 통상, 다음의 「초기」값을 설정합니다.v-model예를 들어 다음과 같이 오브젝트 자체에 대해 설명합니다. data() { return { firstname: 'some..

itsource 2022.07.17
반응형