반응형

vuejs2 143

Vue.js 2 - 하나의 애플리케이션/인스턴스 Vue에서 다른 애플리케이션/인스턴스 Vue로 $emit 이벤트를 발생시키는 방법

Vue.js 2 - 하나의 애플리케이션/인스턴스 Vue에서 다른 애플리케이션/인스턴스 Vue로 $emit 이벤트를 발생시키는 방법 싱글 파일 컴포넌트와 함께 웹 팩을 사용합니다. 메뉴 헤더에 Cart Shopping 드롭다운을 표시하는 Vue 인스턴스가 1개 있습니다. import Vue from 'vue'; import App from './AppShoppingCart.vue'; new Vue({ el: '#shoppingCartApp', template: '', components: {App} }); 같은 페이지에 다른 Vue 인스턴스가 있습니다(제품이 포함된 카탈로그). import Vue from 'vue'; import App from './AppCatalog.vue'; new Vue({ el:..

sourcecode 2022.08.12

VueJs가 함수 내의 데이터 속성에 액세스할 수 없습니다.

VueJs가 함수 내의 데이터 속성에 액세스할 수 없습니다. 함수 내에서 데이터 속성에 액세스하는 데 문제가 있습니다.뭔가 놓친 게 있는데 뭐가 뭔지 모르겠어요. 이것은 나의 수업이다. export default { name: "Contact", components: { FooterComponent: FooterComponent, NavigationComponent: NavigationComponent }, data() { return { locale: Cookie.get('locale'), nameAndLastName: '', email: '', subject: '', message: '', showPopUp: false } }, methods: { sendEmail(e) { e.preventDefau..

sourcecode 2022.08.12

서브디렉토리에서 Vue.js 웹팩 프로젝트를 처리하는 방법

서브디렉토리에서 Vue.js 웹팩 프로젝트를 처리하는 방법 해결책을 찾기 위해 몇 시간 동안 찾아봤지만 떠오르지 않았어요.아래 그림과 같이 Vue.js 2 + webpack (Webpack 템플릿 사용)을 기반으로 한 프로젝트가 있습니다. 에는 두 .src/assets/ ★★★★★★★★★★★★★★★★★」static ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★src/assets/는 웹 에 의해 되며, 에 로 로드됩니다.static/그대로 로딩됩니다(잘못된 경우 정정 또는 오해한 정보를 보완해 주십시오).하지만 이 정보에도 불구하고, 나는 내가 필요한 것을 얻을 방법을 찾을 수 없었다. 문제는 다..

sourcecode 2022.08.12

브라우저 콘솔에서 VueJs $watch 트리거가 작동하지 않음

브라우저 콘솔에서 VueJs $watch 트리거가 작동하지 않음 나는 이것을 가지고 있다.main.jsVue 어플리케이션을 부트스트랩하는 파일입니다. import Vue from 'vue' import App from './App' import router from './router' Vue.config.productionTip = false var model = { a: 1, name: 'Abdullah' } var app = new Vue({ el: '#app', data: model, router, template: '', components: { App }, watch: { a: function(val, oldVal) { console.log('new: %s, old: %s', val, oldVa..

sourcecode 2022.08.10

vuej에서 추가 버튼 로드

vuej에서 추가 버튼 로드 php로부터 고객 리뷰가 있는 어레이를 받았습니다. var comment_list = new Vue({ el: '#comment-list', data: { testimonials: JSON.parse('{!! addslashes(json_encode(array_reverse($product_info['testimonials'])))!!}'), }, methods: { colorAvatar: function(letter) { return 'avatar-' + letter.toLowerCase(); }, starClass: function(star) { return 'star-' + star; } } }); 더 많이 로드하여 10개씩 댓글을 표시하는 버튼을 만들고 싶습니다. 어떻..

sourcecode 2022.08.10

Vue 컴포넌트를 소품 및 슬롯 기본값으로 확장하는 방법

Vue 컴포넌트를 소품 및 슬롯 기본값으로 확장하는 방법 사용하고 있다bootstrap-vue내 어플리케이션에도 있고 테이블도 많은데 모두 같은 보일러 플레이트 코드를 가지고 있어다음은 보일러 플레이트의 예를 제시하겠습니다. 물론 이 보일러 플레이트를 커스텀컴포넌트와 같은 일반적인 모듈로 분류하여 새로운 테이블의 시작점은 다음과 같습니다. 궁극적으로, 저는my-awesome-table평소와 다름없이 행동하다b-table하지만 이 보일러 플레이트는 모두 세팅되어 있고, 필요에 따라 추가 소품이나 슬롯을 설치할 수 있습니다. 하지만 어떻게 해야 할지 모르겠어요.시도했습니다. 래퍼 컴포넌트를 만들지만, 기본 컴포넌트의 모든 기능을 공개하는 데 어려움을 겪고 있습니다.b-table 확장b-table컴포넌트입니다..

sourcecode 2022.08.10

vuej의 data-* 속성 값을 얻는 방법

vuej의 data-* 속성 값을 얻는 방법 버튼을 클릭하면 모달(modal)이 열리며, 모달에 표시할 내용은 해당 버튼에 전달된 데이터 속성을 기반으로 합니다. 제 단추는 Edit 제 모달에는 버튼이 몇 개 있는데, 클릭하면 데이터 속성인 파라미터와 함께 vuejs 함수를 호출해야 합니다. 내 모달 버튼은 Delete Close 여기에서는 파라미터를 전달해야 합니다.deleteItem()이 파라미터는data-id위의 버튼을 누르면 알 수 있습니다. 모달 코드 × Delete Are you Sure you want to delete ? Delete Close 추천하는 것은console.log(this)컴포넌트 함수 내에서 버튼을 클릭하여 해당 함수를 호출하면 컴포넌트의 모든 속성을 검사할 수 있습니다. ..

sourcecode 2022.08.10

다른 데이터 개체 vueJ에 데이터 개체 값을 넣는 방법s

다른 데이터 개체 vueJ에 데이터 개체 값을 넣는 방법s 코드는 다음과 같습니다. data () { return { msg: '', rgbValue: '', newColor: { color: this.msg } } } 이 코드는 작동하지 않습니다.가치를 두고 싶다msg내 생각으로는newColor해결책을 가진 사람이 있나요? 다음은 코드 보완입니다. data () { let msg = ''; return { msg: msg, rgbValue: '', newColor: { color: msg } } }, components: { HeaderComponent: require('./HeaderComponent.vue') }, methods: { msgFunc: function () { colorsRef.pus..

sourcecode 2022.08.10

부모 빌드 툴을 사용하는 Vue 컴포넌트를 올바르게 작성하는 방법

부모 빌드 툴을 사용하는 Vue 컴포넌트를 올바르게 작성하는 방법 이 문제는 특정 빌드 툴(JSX를 사용한 컴포넌트 반응 등)에 의존하는 플러그인/컴포넌트 생태계가 있는 다른 프레임워크에도 적용될 수 있습니다.Vue는 제 사용 사례일 뿐입니다. 여러 Vue 컴포넌트를 싱글 형태로 작성했습니다..vueNPM에 게시된 파일입니다.그package.json이러한 컴포넌트 자체는 웹 팩, vue-variable, sass-variable 등을 사용하는 상위 프로젝트 내에서 기능하도록 되어 있기 때문에 이러한 컴포넌트는 종속성을 일람표시하지 않습니다.이러한 컴포넌트의 예를 다음에 나타냅니다. 이들 컴포넌트가 해당 빌드툴을 가진 부모 패키지에 의존한다고 선언하는 최선의 방법은 불분명합니다.라고는 자신할 수 없다dev..

sourcecode 2022.08.10

Vue.js는 "npm 빌드 실행"하지만 Vue.js는 DOM/작업에 구속되지 않음

Vue.js는 "npm 빌드 실행"하지만 Vue.js는 DOM/작업에 구속되지 않음 여기 Vue.js에 처음 왔어요.버전을 사용하는 Mac OS의 경우: $ npm --version 4.6.1 $ vue --version 2.8.1 나는 이용하고 있어webpack-simpleInitvue 2.0의 vue-cli.나는 내 장고 프로젝트 폴더에서vue 물질들의 폴더를 만들었습니다.frontend. 디렉터리 구조: $ tree ├── README.md ├── asnew │ ├── __init__.py │ ├── migrations │ ├── models.py │ ├── settings.py │ ├── templates │ └── index.html │ ├── urls.py │ ├── views.py │ ├──..

sourcecode 2022.08.09
반응형