vue-component

问题 Using plain HTML/JS, it is possible to view the JavaScript File objects of selected files for an input element like so: <input type="file" id="input" multiple onchange="handleFiles(this.files)"> However, when converting it to the 'Vue' way it doesn't seem to work as intend and simply returns undefined instead of returning an Array of File objects. This is how it looks in my Vue template: <input type="file" id="file" class="custom-file-input" v-on:change="previewFiles(this.files)" multiple>

问题 I'd like to turn a div into input box on click, so that the post (which is rendered inside a loop) can be edited. Here is the button on the post: <a @click="setFocusEdit(index)" v-if="isAuthor(post)" href="#" >Edit Me</a> And the div concerned: <div :ref="'p' + index" class="post-description"> {{post.description}} </div> The method: setFocusEdit(index) { console.log('focusing on', index); this.$refs['p' + index].focus(); }, But I get this error: Uncaught TypeError: this.$refs[("p" + index)]

问题 I'd like to turn a div into input box on click, so that the post (which is rendered inside a loop) can be edited. Here is the button on the post: <a @click="setFocusEdit(index)" v-if="isAuthor(post)" href="#" >Edit Me</a> And the div concerned: <div :ref="'p' + index" class="post-description"> {{post.description}} </div> The method: setFocusEdit(index) { console.log('focusing on', index); this.$refs['p' + index].focus(); }, But I get this error: Uncaught TypeError: this.$refs[("p" + index)]

问题 I expect that currentSelectionViewContent will be re-computed each time when selectedOptionsIndexes has changed. Really, sometimes it works, sometimes - not. import { Component, Prop, Vue, Watch } from "vue-property-decorator"; @Component({ template }) export class SelectField extends Vue { private onNewOptionSelected(newOption: SelectField.Option, indexInArray: number): void { console.log("~~~~~~~~~~~~~~~"); console.log(JSON.stringify(this.selectedOptionsIndexes, null, 2)); this

问题 now i have 2 Components 1 - is just a drop down list v-select <v-row align="center" > <v-col class="d-flex" cols="12" sm="6" v-if="Compounds" > <v-select :items="Compounds" v-model="selectedItems" label="Select" item-value="id" item-text="name" v-on:change="selectedCompound"> </v-select> {{ selectedItems }} </v-col> </v-row> with method methods: { selectedCompound(h2o) { console.log(h2o); console.log("This is from Selected Compound"); }, and i call it in another page <div> <SelectCompound><

问题 I was assigned to do this project as part of my application for a Junior Developer position. I have never worked on Vue.js and they assigned me with this project asking to retrieve JSON data from an endpoint and projecting them in a vuetify table. My main issue is with the vuetify table i can not understand the difference with the normal html table. Moreover i can not understand whether i have to do a small app using html and js files or to use node.js also and work on it. However i did find

问题 I'm currently working on a site based on Vue and using Vue Router for routing. My way to handle scroll behavior to anchor links is the following: const router = new VueRouter({ routes, scrollBehavior (to) { if (to.hash) { return { selector: to.hash, offset: { x: 0, y: 140 } } } return { x: 0, y: 0 } } }) And my links are built in the following way: <router-link class="insurance-link d-block" to="#hogar"> <img class="insurance-logo img-fluid" src="@/assets/home-icon.svg"> Hogar </router-link>

问题 I'm testing Mixins on VueJS and I have a question. Is there a way to call an event directly from a Mixins without having to assign it in my methods ? MyMixins.js import Vue from 'vue' Vue.mixin({ methods: { Alerta(){ alert('WORK!') } } }) app.vue <template> <button v-on:click="AlertaInterno">test</button> </template> <script> export default{ methods:{ AlertaInterno(){ this.Alerta() } } } </script> The code above works. I was wondering how I could invoke the mixin function directly, something

问题 I'm testing Mixins on VueJS and I have a question. Is there a way to call an event directly from a Mixins without having to assign it in my methods ? MyMixins.js import Vue from 'vue' Vue.mixin({ methods: { Alerta(){ alert('WORK!') } } }) app.vue <template> <button v-on:click="AlertaInterno">test</button> </template> <script> export default{ methods:{ AlertaInterno(){ this.Alerta() } } } </script> The code above works. I was wondering how I could invoke the mixin function directly, something

问题 I'm testing Mixins on VueJS and I have a question. Is there a way to call an event directly from a Mixins without having to assign it in my methods ? MyMixins.js import Vue from 'vue' Vue.mixin({ methods: { Alerta(){ alert('WORK!') } } }) app.vue <template> <button v-on:click="AlertaInterno">test</button> </template> <script> export default{ methods:{ AlertaInterno(){ this.Alerta() } } } </script> The code above works. I was wondering how I could invoke the mixin function directly, something