vuetify.js

I have a Vue JS (Vuetify) App that makes an ajax request that I would like to populate a div's content with the response, however I am having difficulties accessing the instance's data . All examples I have seen use this to point to the data object, but when I do I get this error Unable to set property 'message' of undefined or null reference The app is quite simple: main.js : import Vue from 'vue' import App from './App.vue' import Vuetify from 'vuetify' Vue.use(Vuetify) new Vue({ el: '#app', render: h => h(App) }) App.vue export default { data () { return { .... message: '', order: {}, ... }

When we try to fill forms in the internet, required fields are marked using a red color ' * ' mark to indicate that the field is a must. Like that is there a way to indicate users to required fields in vuetify.js? From v1.1.0 docs : The required prop no longer explicitly adds an asterisk to the label. All of its functionality to validation was removed for v1.0. So apparently nothing will set it as required anymore, we have to add it manually in the label: label="Name*" Or you could use CSS: .required label::after { content: "*"; } Tho you must add required class manually (name of the class is

I'm trying to implement Veutify's text field This is what it looks like for me right now: And this is what it looks like when the text field is in focus: These are my imports in main.js import Vue from 'vue'; import Vuetify from 'vuetify'; Vue.use(Vuetify); Am I missing an import or something? I ran in the same issue, you need to wrap your application in a <v-app> . The reason is that the border's color depends on the theme you're using. If you try to inspect the documentation you will see that the border's rule is something like .application--light .input-group .input-group__details :