goodsource

V-for에서 여러 기능을 연결할 수 있습니까? 요소 배열이 있으므로 해당 요소를 div에 렌더링하고 각 요소에 다른 클릭 기능을 추가해야 합니다. . {{option}} 위의 방법을 시도해 봤지만 효과가 없습니다만, 어떻게 할 수 있을까요?각 객체의 각 clickFunction 속성은 문자열이기 때문에 이 방법은 사용할 수 없습니다.@click Atribute는 보통 오래된 문자열에서 무엇을 할 예정입니까?해라 {{option.text}} 각 아이템의 클릭을 듣고 싶은 것 같습니다.따라서 모든 메서드 또는 함수를 1개만 선언하고 각 항목의 키 값을 매개 변수로 전달해야 합니다.그런 다음 switch 문 또는 if 문을 사용하여 어떤 옵션을 클릭했는지 검출합니다.코드를 Bellow로 변경했습니다. . {..

마운트된 속성 변경 사항이 VueJ에서 트리거되지 않음s VueJS 컴포넌트는 클래스 및 텍스트가 계산된 속성으로 버튼을 클릭할 때마다 변경됩니다.로딩 후 버튼을 클릭하기만 하면 정상적으로 변경됩니다.localStorage에 상태를 저장하고 페이지를 새로고침하면 저장된 값에 따라 텍스트와 클래스를 설정합니다.주문된 값은 변경되지만 버튼 텍스트와 클래스가 UI에 반영되지 않습니다.제가 뭘 잘못하고 있는지 짐작 가는 사람 있나요?다음은 소스입니다. {{ order_button_text }} 로컬 스토리지에서 얻을 수 있는 것은 문자열입니다.탑재 시,ordered속성이 부울 대신 문자열이 되므로order_button_text계산된 속성 조건은 절대 참이 되지 않습니다.이 문제를 해결하려면 변환만 하면 됩니다...

Vuetify js에서 비활성 필드의 기본 색상을 변경하거나 재정의하는 방법 기본적으로 vuetify는 비활성화된 텍스트 필드/항목에 밝은 회색 음영을 적용합니다.이 색상을 원하는 색상으로 덮어쓰려면 어떻게 해야 하나요? 현재 비활성화된 선택기를 사용하고 있습니다.:disabled { color: #000000 !important; }텍스트 필드 텍스트 색상의 변경에만 도움이 됩니다.내 폼에는 드롭다운과 체크박스가 있습니다.이에 대한 해결책이 있나요?클래스를 덮어쓰기 위해 텍스트 필드로 시도했지만 작동하지 않습니다만, 모든 양식 입력 요소에 대해 'read only'라는 편리한 소품이 있습니다.'disabled' 대신 'read only'를 사용합니다. 타겟이 될 수 있다 체크박스를 켜다.input-gr..

Vue 및 부트스트랩:미디어 중단점에 따라 다른 컴포넌트를 표시하는 방법최신 컨센서스란? 앱에 대한 첫 번째 "모바일 우선" 접근법(보통 데스크톱에서 시작하여 과거에는 CSS Media 쿼리를 사용하여 작업)을 실행하고 있으며, 오늘날의 응답성 높은 개발 환경에서 다음과 같은 시나리오를 처리하는 가장 좋은 방법이 무엇인지 고민하고 있습니다. 다음과 같은 컴포넌트가 있습니다. 위의 컴포넌트는 디바이스가 특정 브레이크 포인트(720px 이하)보다 낮은 경우에만 표시되도록 합니다. 그 후, 그 이상의 뷰포트는 다음 컴포넌트를 표시합니다. 주의:vertical그리고.inline상기 코드의 소품. 기존 CSS 미디어 쿼리에 맡기는 것이 가장 좋습니까, 아니면 템플릿 조건(v-if)을 사용할 수 있습니까?등)을 클..

Vue 구성 요소가 활성 상태인지 확인하는 방법 Vue 컴포넌트를 사용하고 있습니다.태그를 지정하여 재검출을 방지합니다. 컴포넌트 내에서 메서드를 기동함으로써 글로벌 데이터의 변화에 대응하고 싶습니다.단, 현재 컴포넌트가 활성화 되어 있는 경우에만 메서드를 기동합니다. 지금은 이렇게 하고 있어요. export default { data() { return { globalVar: this.$store.state.var, isComponentActive: false, }; }, methods: { foo() { console.log('foo') }; }, watch: { globalVar() { if (this.isComponentActive) { this.foo(); } }, }, activated() {..

Vue-loader 구문 오류:js 파일에서 구성 요소를 가져올 때 예기치 않은 토큰 {이(가) 발생했습니다. 웹 팩 2를 사용한 vue 2 프로젝트가 있습니다.잠시 포기했다가 다시 돌아와 보니 이전 버전과 관련이 있을 것 같은 오류가 몇 개 발견되어 webpack 3으로 업그레이드하여 vue-loader를 업데이트했습니다. 이제 오류가 발생한 것 같습니다.Syntax Error: Unexpected token {js 파일로 컴포넌트를 Import하려고 할 때마다. 예를 들어 다음과 같습니다. import App from './App.vue' 이 에러를 표시합니다.다른 vue 컴포넌트 내에서 컴포넌트를 Import해도 문제가 없는 것 같습니다. 또한 main.js에서 앱을 초기화하는 방법도 여기에 있습니..

감시 어레이에서 인덱스를 취득하다 어레이의 변경을 감시하는 vue 애플리케이션이 있습니다.잘 되고 있어요.그러나 워치 콜백은 이전/새 값으로만 전달되기 때문에 변경된 어레이 항목의 인덱스를 얻는 방법을 잘 모르겠습니다. 데모: http://jsfiddle.net/q3zd4fmv/ 간단한 예: new Vue({ el: '#demo', data: { things: [{foo:1}, {foo:2}] }, watch: { things: { handler: function (val, oldVal) { alert('a thing changed') }, deep: true } }, methods: { change: function () { this.things[0].foo = 5 } } }) 아쉽게도 개봉 후로는 아..

Vue.js 범용 다이내믹 컴포넌트 렌더링 소품으로 사용할 수 있는 컴포넌트를 동적으로 렌더링하는 컴포넌트가 있습니다. 이 문제는 Import에 있습니다.다이나믹 Import가 필요합니다.웹 팩을 사용하면 다음과 같이 다이내믹 Import를 할 수 있습니다.() => import('./my-async-component')의 경우 lazy Load는 필요 없습니다. 따라서 일반적인 더미 컴포넌트가 필요합니다(dynamic-component-renderer어떤 컴포넌트가 취득될지 알 수 없으며 동적으로 렌더링됩니다.언급URL : https://stackoverflow.com/questions/56807294/vue-js-generic-dynamic-component-rendering

VueJ를 사용하여 텍스트 영역의 일부 문자를 차단하려면 어떻게 해야 합니까? 메시지를 보내기 위한 텍스트 영역이 있으며 이메일과 사이트 링크를 차단하고 싶습니다.그래서 제가 글을 쓸 때@또는https://v-if를 사용하면 오류 메시지가 표시되어야 하는데 어떻게 해야 합니까?어떤 기능? new Vue({ el: "#app", data: { message: { content: "" } }, }) body { background: #20262E; padding: 20px; font-family: Helvetica; } #app { background: #fff; border-radius: 4px; padding: 20px; transition: all 0.2s; } No special characters ..

컴포넌트 내부의 단일 지점에서 vuejs 오류를 캡처하는 방법 이 컴포넌트에서는 많은 공리를 사용하고 있습니다.then().catch()내가 항상 던지고 있는 캐치 안console.error()예를 들어 다음과 같습니다. axios.get( //... ).then( //... ).catch( error => { console.error(..) } ) 그 밖에도 에러를 던지는 곳이 몇 군데 있어요.에러를 글로벌하게 처리할 수 있는 방법이 없는지 찾고 있습니다.사용자 인터셉터를 사용할 수 있는 악리는 알고 있습니다만, vue 컴포넌트는 에러를 검출할 필요가 있기 때문에 하나의 함수로 통합할 수 있습니까?Vue API는 를 제공하지만 메서드의 오류를 검출하지 않습니다(강조). 컴포넌트 렌더링 기능 및 워처 중..