vue-component

问题 I'm learning Vue.js and I'm struggling to find a way to organize my code. I'm trying to make everything as modular as possible, so when making a slider i did the following: <template> <div class="banners"> <slot></slot> </div> </template> <script> export default { methods: { echo() { console.log('Echoing..') } }, mounted() { $('.banners').slick(); } } </script> And in my view I simply use the component: <banners> <?php for ($i = 0; $i < 5; $i++) : ?> <img src="http://lorempixel.com/1440/500"

问题 I am having an issue where when I change a component in my app, many unrelated components seem to be rerendering too. When I use the Vue performance timings config, I see something like (all in the span of about 200ms) I am trying to figure out what causes these components to rerender. I saw a tip about how to tell the cause of a rerender, but when I put this snippet* in all the rerendering components, I don’t get anything logged to the console. So, how can I find what is causing all these

问题 I use VueJs with VueCli, and I would like to load a CSS file according to a "source" parameter that would be passed to the initiation of my main App component. I would like to initialize my component like this in the index file: Main.js: import Vue from 'vue' import App from './App' import router from './router' import VueLadda from 'vue-ladda' import VueResource from 'vue-resource' import VModal from 'vue-js-modal' import BootstrapVue from 'bootstrap-vue' Vue.use(VModal); Vue.use

问题 I use VueJs with VueCli, and I would like to load a CSS file according to a "source" parameter that would be passed to the initiation of my main App component. I would like to initialize my component like this in the index file: Main.js: import Vue from 'vue' import App from './App' import router from './router' import VueLadda from 'vue-ladda' import VueResource from 'vue-resource' import VModal from 'vue-js-modal' import BootstrapVue from 'bootstrap-vue' Vue.use(VModal); Vue.use

问题 I have a component QuestionContainer.vue with several questions (input forms). Every user given answer (user input) is validated in realtime ( @keyup.prevent="keyUpRoutine(questionkey)" ) unsing a method named keyUpRoutine(questionkey) . If all answers are valid, I perform a consistecy check: In QuestionContainer.vue: keyUpRoutine(questionkey) { var value = event.target.value; var question = this.questions[questionkey]; question.validated = this.validate(question, value) ? true : false; this

问题 Steps to reproduce: If its multiple select required rules don't work if its not a multiple its ok. Expected Behavior rules to work for multiple select as well Actual Behavior rules don't work if its multiple select Reproduction code : <div id="app"> <v-app id="inspire"> <v-select :items="role" label="Admin level*" class="mt-3 " @focus="reset" item-text="name" item-value="name" v-model="roleee" required :rules="rules.select" ></v-select> <v-select :items="subsidiaries" label="Subsidiary*"

问题 I am trying to bind a click event on dynamically generated subheader v-list-tile Vuetify https://vuetifyjs.com/en/components/subheaders but each time I click the option an error appears. vue.js:634 [Vue warn]: Error in v-on handler: "TypeError: handler.apply is not a function" found in ---> <VListTile> <VList> <VCard> <VApp> <Root> I have tried adding the methods forcibly (without passing object) and it works. It just triggers when it is passed to an object and dynamically rendered. Here is a

问题 I am trying to bind a click event on dynamically generated subheader v-list-tile Vuetify https://vuetifyjs.com/en/components/subheaders but each time I click the option an error appears. vue.js:634 [Vue warn]: Error in v-on handler: "TypeError: handler.apply is not a function" found in ---> <VListTile> <VList> <VCard> <VApp> <Root> I have tried adding the methods forcibly (without passing object) and it works. It just triggers when it is passed to an object and dynamically rendered. Here is a

问题 I am trying to bind a click event on dynamically generated subheader v-list-tile Vuetify https://vuetifyjs.com/en/components/subheaders but each time I click the option an error appears. vue.js:634 [Vue warn]: Error in v-on handler: "TypeError: handler.apply is not a function" found in ---> <VListTile> <VList> <VCard> <VApp> <Root> I have tried adding the methods forcibly (without passing object) and it works. It just triggers when it is passed to an object and dynamically rendered. Here is a

问题 1. How can I set the default value for a component prop in Vue 2? For example, there is a simple movies component that can be used in this way: <movies year="2016"><movies> Vue.component('movies', { props: ['year'], template: '#movies-template', ... } But, if a user doesn't specify the year : <movies></movies> then the component will take some default value for the year prop. 2. Also, what is the best way to check if a user did not set the prop? Is this a good way: if (this.year != null) { //