Javascript 属性。单个文件组件vue js上未定义$el
我试图使用laravel mix和vue js创建一个全局组件,但在访问属性Javascript 属性。单个文件组件vue js上未定义$el,javascript,vue.js,vuejs2,vue-component,laravel-mix,Javascript,Vue.js,Vuejs2,Vue Component,Laravel Mix,我试图使用laravel mix和vue js创建一个全局组件,但在访问属性this.$el时,它是未定义的。这是我的组件文件: Datepicker.vue <template> <input type="text" :name="name" :class="myclass" :placeholder="placeholder" :value="value" /> </template> <scri
this.$el
时,它是未定义的。这是我的组件文件:
Datepicker.vue
<template>
<input
type="text"
:name="name"
:class="myclass"
:placeholder="placeholder"
:value="value" />
</template>
<script>
export default {
props: ['myclass','name','placeholder','value'],
data () {
return {
}
},
created () {
console.log("this.$el", this.$el); //undefined
console.log("this", this); //$el is defined
var vm = this;
var options = {
"locale": "es",
"onChange": function(selectedDates, dateStr, instance) {
vm.$emit('input', dateStr);
}
};
$(this.$el)
// init
.flatpickr(options);
},
destroyed(){
console.log("destroyed");
}
}
</script>
create.blade.php
<script type="text/x-template" id="datepicker-template">
<input
type="text"
:name="name"
:class="myclass"
:placeholder="placeholder" />
</script>
在安装之前不存在
mounted() {
var vm = this;
var options = {
"locale": "es",
"onChange": function(selectedDates, dateStr, instance) {
vm.$emit('input', dateStr);
}
};
$(this.$el)
// init
.flatpickr(options);
},
请参阅文档中的。但当使用X-Template创建组件时,它会起作用,$el在装入之前一直存在。@ivanjj22否,在X-Template示例中,您使用的是mounted
。
mounted() {
var vm = this;
var options = {
"locale": "es",
"onChange": function(selectedDates, dateStr, instance) {
vm.$emit('input', dateStr);
}
};
$(this.$el)
// init
.flatpickr(options);
},