반응형

vuejs2 121

Vue js 마운트된 특정 div로 스크롤

Vue js 마운트된 특정 div로 스크롤 이 스크립트를 찾았는데 버튼을 클릭하시면 정상적으로 동작합니다.내가 원하는 것은 페이지가 특정 div로 자동 스크롤되는 것이다. 어떻게 하면 될까요? Go to porto Porto page methods: { goto(refName) { var element = this.$refs[refName]; console.log(element); var top = element.offsetTop; window.scrollTo(0, top); } }, 마운트된 것은 렌더 후에 호출되지만 마운트 상에서 바로 스크롤하려고 하면 스크롤이 작동하지 않을 수 있습니다. 타임아웃이 없는 심플한 set Timeout이 효과가 있습니다.이것은 보기 흉할 수도 있지만, 매력적으로 기능합..

source 2022.08.28

Javascript Package Manager를 사용하지 않고 VueJS 플러그인 포함

Javascript Package Manager를 사용하지 않고 VueJS 플러그인 포함 Javascript Package Manager(NodeJ, NPM)를 사용하지 않을 경우 VueJs 플러그인을 어떻게 사용할 수 있습니까? Coldfusion(CFWheels)에서 Bootstrap 템플릿과 Server Side 프레임워크로 만든 앱을 만들고 있습니다. 양방향 데이터 바인딩, animate.css를 사용한 애니메이션의 손쉬운 통합 등 VueJs의 기능을 사용하고 싶었습니다.나는 그것을 통해 포함했다. 다만, NPM은 앱이 계속 개선되어 생산되고 있기 때문에 사용할 수 없습니다. VueJs 자동 검색과 같은 일부 VueJs 플러그인을 사용하려고 합니다. 스크립트를 첨부하여 문서를 시험하면 Javasc..

source 2022.08.28

Vue.js2 - 어레이에 __ob_: 옵서버가 포함되어 있습니다.

Vue.js2 - 어레이에 __ob_: 옵서버가 포함되어 있습니다. (아마도) vue.js에 관한 초보자의 질문입니다.웹 소켓에서 받은 CanvasJS 라이브러리를 사용하여 데이터를 표시하려고 합니다.vue 컴포넌트를 사용하기 전까지는 데이터 작업이 정상적으로 진행됩니다.확실히 하기 위해서: export default { data() { return { cartesian: null, ws: null } }, methods: { fillData(res) { var data = JSON.parse(res.data) var buffer = data.mdi console.log(buffer) this.cartesian = data.mdi console.log(this.cartesian) } }, mounted(..

source 2022.08.28

vuejs 구성 요소에서 버튼을 클릭하여 URL을 클립보드에 복사

vuejs 구성 요소에서 버튼을 클릭하여 URL을 클립보드에 복사 다음 컴포넌트를 가지고 있는데, 이 컴포넌트를 복사하는 버튼을 원합니다.link_url클릭해서 클립보드로 이동합니다. 아이디 선택 시 동작하는 Javascript 코드를 가지고 있지만 링크에는 아이디가 없습니다.다음 중 하나를 선택할 수 있습니까?a-tag컴포넌트 자체의 참조 또는 이 작업을 수행하는 최선의 방법을 참조하십시오. 또한 이 .link_url을 사용하여 a-tag를 생성할 생각도 했습니다.copyURL()역동적이긴 하지만 그건 매우 지저분할 것 같아요.나는 vuejs 방식을 찾고 있다. {{ link_name }} copy url from a tag vuej를 사용해야 하는 경우ref그것을 속성으로 추가하다. {{ link_n..

source 2022.08.28

Bootstrap Vue - 메시지박스 확인 모드를 타임아웃할 수 있는 방법이 있습니까?

Bootstrap Vue - 메시지박스 확인 모드를 타임아웃할 수 있는 방법이 있습니까? JS와 stackoverflow는 모두 처음이라 좀 더 자세히 설명해야 하는지, 더 나은 방법이 있는지 알려주세요. 목표는 입력이 제공되지 않는 설정 시간 후 모달(가능하면 msgBoxConfirm 모달)을 닫거나 프로그래밍 방식으로 "취소"하는 것입니다.set Timeout으로 랩을 해서 타임아웃 함수를 호출하려고 했는데 두 번 다 실패했습니다. 다음은 타임아웃을 추가하고 싶은 코드의 골격입니다. timedModalAlert: function () { this.$bvModal.msgBoxConfirm('Session expiration in XX. Press OK to continue.') .then(value =..

source 2022.08.28

VueJ가 새로운 개체를 어레이에 푸시하여 데이터가 반응하지 않음

VueJ가 새로운 개체를 어레이에 푸시하여 데이터가 반응하지 않음 현재 데이터 구조입니다. days: [ { id: 0 name: 'Monday', times: [] }, { id: 1 name: 'Tuesday', times: [] } } 다음 방법을 사용하여 시간 배열에 개체를 추가합니다. onTimeAdded (dayId) { const dayIndex = this.days.findIndex(day => day.id === dayId) this.days[dayIndex].times.push({ from: '09:00', to: '18:00' }) } 이렇게 하면 개체가 배열에 추가되지만 개체의 속성 중 하나 값을 변경하면 반응하지 않습니다. 개체의 시작 및 끝 속성을 다음과 같이 정의합니다. 반응형..

source 2022.08.28

Vue.js 2: 데이터 개체에서 속성 삭제

Vue.js 2: 데이터 개체에서 속성 삭제 Vue.js 데이터 개체(즉, 연관 배열)에서 속성/키를 삭제하는 방법은 다음과 같습니다. var vm = new Vue({ data: { users: { foo : { firstName: ..., lastName: ... }, bar : { firstName: ..., lastName: ... } } }, methods: { someFunction : function () { // how to remove `users.foo`? } } }); 검색해보니 다음 두 가지 방법을 찾았는데 둘 다 작동하지 않습니다. delete this.users.foo;는 DOMOM을 않습니다. this.users.splice('foo', 1);전혀 동작하지 않는다(어레이에서만 ..

source 2022.08.28

bootstrap-vue: b-form-datepicker가 정지될 때까지 v-모델로 업데이트되지 않음

bootstrap-vue: b-form-datepicker가 정지될 때까지 v-모델로 업데이트되지 않음 사용하고 있다b-form-datepicker그리고 선택한 날짜를 기본 상태로 재설정하는 추가 버튼을 사용하고 싶습니다.이 버튼을 누르면 다른 날짜 선택기, 입력 양식 및 드롭다운 다중 선택도 재설정됩니다.이 기능은 정상적으로 구현되어 있습니다만, 리셋을 클릭해도 날짜 피커가 즉시 갱신되지 않고, 일시정지 또는 클릭이 되어 있는 경우에만 갱신됩니다. 표시는 다음과 같습니다. Reset 처음에 모델을 이렇게 설정했습니다. created () { this.minDate = this.$moment().subtract(5, 'years').toDate() this.maxDate = this.$moment().t..

source 2022.08.27

URL에서 쿼리 문자열 매개 변수를 제거하는 중

URL에서 쿼리 문자열 매개 변수를 제거하는 중 앵귤러에서 오다JS Vue.js 2에서도 충분히 쉬울 거라고 생각했어요.하지만 Vue에서는 이것이 설계상 어려운 것 같습니다. 각진 상태JS 할 수 있어$location.search('my_param', null);실제로 변하게 될 것이다.https://mydomain.io/#/?my_param=872136안으로https://mydomain.io/#/. Vue에서 나는 시도했다.this.$router.replace('my_param',null);단, 이 방법은https://mydomain.io/#/?my_param=872136->https://mydomain.io/#/my_param빈 my_discloss는 그대로 둡니다. Vuejs2에는 Url에서 쿼리 ..

source 2022.08.27

Vue.js 캐시 메서드 결과

Vue.js 캐시 메서드 결과 현재 다음과 같이 같은 루프 내에서 같은 함수를 2회 호출하는 루프가 있습니다. {{ count(Number(key)) }} 왜냐하면count메서드가 두 번 호출되고 있기 때문에 디버깅이 어려워집니다.count와 같은 것으로 기능하기 때문에console.log모든 값이 두 번 표시됩니다. 첫 번째 카운트 방식에서는 단순히 0인지 확인하고 다른 하나는 카운트를 나타냅니다.그 결과를 재사용할 수 있는 간단한 방법이 있을까요?count두 번 부를 필요가 없습니다.이미 결과가 나왔을 때는 다시 전화할 필요가 없습니다. 현재 반복 키를 전달해야 하므로 계산된 속성 같은 것이 작동하지 않습니다.안타깝게도 메서드는 항상 재렌더되기 때문에 사용 가능한 캐시는 없습니다. 이에 비해 메서드 ..

source 2022.08.27
반응형