vuetify.js

问题 All: I'm trying to add multiple Vuetify date pickers to a single page. I'm using it within a v-menu so that when a date is selected it is shown in a text field. The issue I'm having is: when I select a date for the first date field everything works as expected but when I click to select the second date it is populating the first date field again. I have the following: <div v-for='foo in foos' :key='foo.id'> <v-menu :close-on-content-click="false" v-model="menu" :nudge-right="40" lazy

问题 I've a data table <v-data-table> that has tons of records and have 7 columns. Vuetify's data table has one filter for all of them and it is working, but I want individual filter for all of the columns. I'm getting the data from the backend using axios, then filter the data, push it into an array and then display it in the table. How do I go about that? I'm new at Vue, and I am not working with Vuex for this project. I've looked at other questions on stack-overflow but they are mostly talking

问题 Any kind of button included on the expansion panel will also open/close the panel when you click it (propagation), which is undesired generally. This is easily prevented with using @click.stop. v-edit-dialog component presents a challenge however. How do you prevent this edit-dialog from opening/closing the expansion panel when it is activated? new Vue({ el: '#app', data(){ return { title: "Editable Title" } } }) <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>

问题 I am not able to pass data to my custom component, my component uses vuetify, currently I dont get any message: MY component: <template> <v-layout> <v-flex xs12 sm6 offset-sm3> <v-card> <v-img src="https://cdn.vuetifyjs.com/images/cards/desert.jpg" aspect-ratio="2.75" ></v-img> <v-card-title primary-title> <div> <h3 class="headline mb-0">{{ tenantName }}</h3> <div>{{ tenantDescription }}</div> </div> </v-card-title> </v-card> </v-flex> </v-layout> </template> <script> export default { data ()

问题 i am using Vuetify 2.0.14. i have followed this post Change Default Font in Vuetify and taken the solution from @tzahi-leh. But i see the web page is partially changed with my custom font. I know Vuetify has the default Roboto font and i wanted to be changed as 'Ubunut'. i also download the Ubuntu font family and placed inside the assets/fonts folder. my App.vue Style Content <style lang="scss" scoped> $typoOptions: display-4 display-3 display-2 display-1 headline title subtitle-1 subtitle-2

问题 Parent component: <template> <v-btn v-on:click="dialog = !dialog"> </v-btn> </template <script> export default { data: () => ({ dialog: false } </script Child component: <template> <v-layout> <v-dialog v-model="toggledialog"> <v-btn color="green darken-1" flat="flat" @click.native="toggledialog = false">Close</v-btn> </v-dialog> </v-layout> </template> <script> export default { data: () => ({ toggledialog: false, }), watch: { dialog: function(){ this.toggledialog = true }, }, props:['dialog']

问题 I want to ask. How can I add button click for call a method if I click icon next month in the datepicker? Look at this : How can I do it? Update : I using vuetify : https://vuetifyjs.com/en/components/date-pickers#date-pickers-allowed-dates 回答1: Probably you're looking for something like this: https://vuetifyjs.com/en/components/date-pickers#date-pickers-react-to-displayed-month-year-change Basically you should use the picker-date.sync prop and watch for its changes using a watcher. <v-date

问题 I have a problem Look at this : https://codepen.io/positivethinking639/pen/YzzWyaR?editors=1010 If the script executed, the result of console.log(date) is Whereas from my script should the result 2019-10-01 2019-10-02 ... ... 2019-10-31 why the results don't match? if I choose next month, the results will also not match 回答1: Updated for loop initialisation for(var i = 1; i <= totalDay; i++) { and let date = moment().month(val.split('-')[1]-1).date(i).format("YYYY-MM-DD") Now it works as

问题 I am trying to change the named colors in Vuetify so that the visual controls in use around the application inherit the theme centrally and won't require individual color definitions for each component. The Vuetify theme docs say this about changing theme colors: This can be easily changed. Simply pass a theme property to the Vue.use function. You can choose to modify all or only some of the theme properties, with the remaining inheriting from the default. However, I am not seeing this work

问题 I am using vuejs, vuex, and vuetify. There are 3 files involved I will post the important parts. Basically I want to display data corresponding to the route parameter. Whenever I use the following in my Product.vue <h1 class="heading primary--text"> {{ product.partNumber }}</h1> Nothing on that file loads, and when I check the console I get the following... Chrome: "TypeError: Cannot read property 'find' of undefined" Firefox: [Vue warn]: Error in render: "TypeError: state.loadedProducts is