Vue js가 사용자 지정 구성 요소를 렌더링하지 않음
저는 이것을 사용하고 있습니다.http://monterail.github.io/vue-multiselect/ vue와 그 libaries를 사용하여 단일 js 파일을 빌드하고 다른 코드를 스크립트 태그에 넣습니다.컴포넌트가 등록되었습니다.데이터를 넣었더니 비어있네요
'시작하기'의 코드일 뿐 특별한 건 없어요콘솔에 오류는 없고 빈 노드만 있습니다.중요한 건 이걸 다른 컴포넌트 안에 넣고inline-template
(루트: 루트에서도 동일)
이렇게 해서 웹 팩을 사용하여 파일이 생성되었습니다.
window.Vue = require('vue');
window.Multiselect = require('vue-multiselect');
그러면 컴파일된 파일을 넣고 스크립트를 추가합니다.
<script>
Vue.component('multiselect', Multiselect);
new Vue({
el: '#vue-app',
data: {
options: ['one', 'two'],
model: ''
},
created: function () {},
computed: {},
methods: {}
});
</script>
그'vue-multiselect'
모듈은 다음과 같이 Import됩니다.
import Multiselect from 'vue-multiselect'
를 사용하여 할당한다.Multiselect
모듈의 디폴트 내보내기 값이 됩니다.
하지만, 당신이require
, 할당하고 있습니다.Multiselect
모듈 오브젝트가 되다default
구성 요소의 구성 옵션을 포함하는 속성.기본 내보내기가 해결되지 않고 액세스하려는 값이 다음 위치에 있습니다.Multiselect.default
.
다음 중 하나를 사용해야 합니다.import
또는 에 액세스 합니다.default
정의 시 속성'multiselect'
컴포넌트:
Vue.component('multiselect', Multiselect.default);
언급URL : https://stackoverflow.com/questions/44398312/vue-js-not-rendering-a-custom-component
'programing' 카테고리의 다른 글
java.lang을 방지하려면 어떻게 해야 하나요?NumberFormatException:입력 문자열의 경우: "N/A"? (0) | 2023.01.20 |
---|---|
jstl의 foreach 루프에서 인덱스 값을 가져오는 방법 (0) | 2023.01.20 |
MySQL을 datetime 필드와 비교()(시간이 아닌 날짜만) (0) | 2023.01.20 |
$this->db->affected_rows()는 왜0을 반환합니까? (0) | 2023.01.20 |
JavaScript "new Array(n)" 및 "Array.protype.map" 이상 (0) | 2023.01.20 |