Vue.js

问题 I have a website that embeds the Youku video player. This player is loading some insecure resources (over http instead of https). The player itself is loaded over https as outlined in this SO thread, but it loads some insecure resources. The insecure resource in question can be accessed via https: https://g2.ykimg.com/052100015C8F58A9AD97EB1AC20B9132 Is there a way to force all request being made from my Vue app to be loaded via https? 回答1: In the end the solution was to include a meta tag in

问题 I'm using vue-router to set routeguard in my system, redirecting the user if there's a token back to dashboard if they try to input /login or /login/ in the URL, and vice versa if they have no token. router.js router.beforeEach((to, from, next) => { if (to.fullPath === '/dashboard/') { if (!store.state.authToken) { next('/login'); } } if (to.fullPath === '/login/') { if (store.state.accessToken) { next('/dashboard'); } } next(); }); my problem is that if I type '/login' or '/dashboard'

问题 I am trying to access the index of an iteration in Vue's v-for binding. This is the object: const obj = { obj1: { some: 'data' }, obj2: { some: 'data' }, obj3: { some: 'data' } } and I'm looping over it: <li v-for="(object, index) in obj" :key="index">{{ object.some }}</li> The problem is that contrary to looping over an array the index variable in case of looping over an object like this does not hold the iteration index (e.g. 0 , 1 , 2 ) but actually holds the object name obj1 , obj2 , obj3

问题 I need to pass logged user id to back-end and I have vuex store so I can get my user info like {{currentUser.id}} the problem is i cannot pass it to back-end it gives me validation error that user_id is required while i have this hidden input in my form <input type="hidden" name="user_id" :value="currentUser.id"> for normal inputs i have v-model like v-model="project.title" which is not possible to use on hidden fields. The question here is how can I pass my user_id to back-end? Code <script>

问题 I'm currently using this UI component from http://www.vue-tags-input.com I'm planning to create a reusable component for vue-tags-input, here's my current code: components/UI/BaseInputTag.vue <template> <b-form-group :label="label"> <no-ssr> <vue-tags-input :value="tags" @tags-changed="updateValue"/> </no-ssr> </b-form-group> </template> <script> export default { name: 'BaseInputTag', props: { label: { type: String, required: true }, value: { type: [String, Number, Array] }, tags: { type:

问题 I am trying to access the index of an iteration in Vue's v-for binding. This is the object: const obj = { obj1: { some: 'data' }, obj2: { some: 'data' }, obj3: { some: 'data' } } and I'm looping over it: <li v-for="(object, index) in obj" :key="index">{{ object.some }}</li> The problem is that contrary to looping over an array the index variable in case of looping over an object like this does not hold the iteration index (e.g. 0 , 1 , 2 ) but actually holds the object name obj1 , obj2 , obj3

问题 I'm trying to loop a tr within a table with Vue.js and Nuxt. But when I load the page I get the following error vue.runtime.esm.js?2b0e:619 [Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside , or missing . Bailing hydration and performing full client-side render. When I remove the table from the following block of code from my HTML the error disappears.

问题 Good morning, I find myself working with the Konvajs library, https://github.com/konvajs/vue-konva There is the following documentation: https://konvajs.org/docs/sandbox/Connected_Objects.html, but I can't implement it with vuejs Since what I need to do is that when selecting object 1, I can drag and form the arrow and when selecting object 2, they are linked Currently I have built the following: <template> <v-container> <v-stage :config="configKonva"> <v-layer> <v-circle :config=

问题 I am new on Vue and Vuetify framework. and I directly copy these code from Vuetify. https://vuetifyjs.com/en/components/navigation-drawers Here is the code. https://codepen.io/kellymei/pen/NBzBEG Output of the code below then Vuetify nagviation drawer main text (hi) displays on bottom instead of the right side I want it to be in the right side of the nagviation drawer. Please help thanks so much!!!!!! <div id="app"> <v-app id="inspire"> <v-navigation-drawer stateless value="true" > <v-list>

问题 So I have a single page frontend only app. Right now I have something like this // db.js import firebase from "firebase/app" import "firebase/firestore"; var firebaseConfig = { ... }; export const db = firebase .initializeApp(firebaseConfig) .firestore(); in main.js I was experimenting with putting the db instance in the global window scope just to see if I could go to the chrome web console and access it to submit a doc and indeed I can // main.js import { db } from './db' window.db = db;