I want to use slots in Vue to create a dynamic modal component. I already tried a lot of tutorials of Vue / slots, but none of them is exactly what i’m looking for. This is a piece of my modal.vue: This is my javascript compiled file: This is piece of my HTML file: I was expecting that all elements
Tag: vuejs2
How do I initialize a default “data” value to the returned value of a callback function?
I am running into an issue being able to initialize a value on App.vue to the result of a function when that function is async. I also tried setting it to the resolution of a promise but that didn’t seem to work either. In the former case I just get an undefined value, and in the second I just get
How to clean up v-bind directives from html code in Vue?
Ok, I’ve got some Vue code and HTML. For example: And in my page: It all works, but if I read the page source, I see the v-bind:selects=”selects” portion, which is not standard compliant, I guess. Similarly, other components have other object properties like: which on the page source evaluates to something like: which is obviously not desirable. How do
2 components almost identical to each other. The only difference is that each component has a different GET request. Merge them?
I currently have 2 components which are almost identical to each other. HTML structure and CSS rules are the same and the only difference is that on mounted() of these components, a different GET request is made. One gets all the visited places and one gets all wishlisted place. The response to both GET request has the same structure, it
Cannot specify url in .env file vue cli 3
I’m referring to the documentation about environment variables in vue cli 3. I’m able to set it up and get simple variables to show up but my url in the .env file doesn’t show up. Contents of the .env file: Here is how I’m viewing the env: The API_URL is not visible, am I doing something wrong? Answer Refer to
Vuelidate: setting $model does not update component
Given the following Vue component that uses Vuetify and Vuelidate: I would like to programmatically change the value of this.picker. I tried both changing the v-model as well as the Vuelidate $model: and Neither of them caused a change in the UI nor produced an error message. How can I programmatically update the DatePicker’s value? Answer Try just assigning v-model
Vue JS – How do I get WebGL to render via Vue without disappearing?
Question I’m trying to use Vue JS to display some very simple WebGL. I use a Vue method call inside my canvas element to start the function that renders the WebGL. It all works fine, except that the rendered image flashes on the screen in a flash, then disappears. The image is a simple triangle that’s supposed to just sit
Vue How to Merge Two Arrays From Same Object?
I am pulling data from an API that gives me an object of items, each containing a string named correct_answer and an array named incorrect_answers. I am trying to combine those values within each item, so when I do v-for, it will loop through the answers merged together in one loop. I also want to randomize the order of those
Vue JS typescript component cannot find inject instance properties
I’m working with typescript and vue. In my app there is a service which is a global for every sub component. I found this native vue solution on vue JS to inject this property on the child components. on main.ts on any typescript vue component This way I’m able to get the injected service on my Child components. However I’m
Vue’s transitions don’t work when you refresh the browser?
Vue’s Transitions don’t seem to work when you refresh your browser. For instance, when I click to go to http://myvue.com/#/foo I get the transitions and all the console logs. But I don’t get the transitions and the logs when I refresh my browser on http://myvue.com/#/foo Any ideas? Answer