Вопросы и ответы - vuejs3
airbrake asp.net async-await axios bootstrap-4 buefy chart.js composition css custom-component custom-directive debounce dom-events ecmascript-6 element-ui es6-modules eventemitter fetch firebase focus google-chrome-devtools google-chrome-extension google-oauth gsap html iframe image inertiajs input ionic-framework ionic4 javascript jestjs jquery laravel laravel-8 laravel-mix laravel-mix-vue3 linter lodash migration monaco-editor multi-touch npm npm-package nuxt.js object path php plugins portal primevue printing properties proxy random reactive rollup rollupjs session-storage socket.io string-interpolation svg swiper swiperjs symfony templates testing transition typescript uikit v-for vee-validate vetur vitejs vue-apollo vue-chartjs vue-cli vue-cli-4 vue-component vue-composition-api vue-directives vue-i18n vue-loader vue-reactivity vue-router vue-router4 vue-test-utils vue.js vuejs2 vuejs3 vuex vuex-modules vuex4 watch webpack webpack-encore
Есть ответ!
Использование Vue3. Я хочу установить роли, разрешенные в определении маршрута, а затем использовать это значение в beforeRouteEnter. Что-то вроде:
{
path: "secure/page",
name: "SecurePage",
component: SecurePage,
params: {role: admin},
}
Затем
const guard = {
template: `...`,
beforeRouteEnter (to, from, next) {
next(vm => {
if( '...
Есть ответ!
В приложении vuejs3 я извлекаю данные из БД с помощью метода axios in, например :
<script>
import appMixin from '@/appMixin'
import app from './../../App.vue' // eslint-disable-line
import axios from 'axios'
const emitter = mitt()
export default {
name: 'adminCategoriesList',
mixins: [appMixin],
data: function () {
return {
categoriesPerPage: 20,
...
Есть ответ!
В приложении vuejs3/vee-validate 4 при отправке формы я пытаюсь отправить запрос с помощью vuex и
потерпел неудачу, так как не могу получить доступ к объекту хранилища. Я делаю:
<template>
<Form @submit="onSubmit" :validation-schema="schema" class="login">
<label class="col-form-label" for="email">Email:</lab...
Есть ответ!
Я пытаюсь использовать реактивный массив в компоненте.
Он работает с объектом, но не с массивом объектов.
Как обновить представление при обновлении массива ?
var self = currentClassInstance // this
self.store = {
resources: Vue.reactive([]),
test: Vue.reactive({ test: 'my super test' }),
setResources(resources) {
// this one doesn't update the view. ?
this.resources ...
Есть ответ!
когда я пытаюсь добавить Вью с названием i18n я бегу в эту ошибку:
Есть ответ!
Я хочу заполнить таблицу данными, которые я получаю обратно из своего API. Теперь таблица не отображает никаких данных, но я извлекаю и вижу данные в моем console.log. Я неправильно вызываю данные в свою таблицу?
<template>
<div>
<table>
<tr>
<th>S/N</th>
<th>Username</th>
<th>Email</th>
<th&...
Есть ответ!
У меня есть проект фреймворк Laravel 8 и обновить фреймворк Laravel-смешать до V6, чтобы поддержать вю-3.
Проблема заключается в createWebHistory от vue-router 4
пакет.в JSON
{
"private": true,
"scripts": {
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-option...
Есть ответ!
В функции Vue3 по defineComponent, первый универсальный параметр-это реквизит, поэтому я указываю тип реквизита, используя вот машинописного текста интерфейса. любить:
export default defineComponent<{ initial?: number }>({
setup(props) {
const count = ref(props.initial ?? 0);
const increase = () => count.value++;
const decrease = () => count.value--;
return { count, i...
Есть ответ!
Я попробовал последовать за ним:
https://github.com/visualfanatic/vue-svg-loader/tree/master
но есть конфликт версий с Vue-template-compiler, так как он используется в Vue 2.
Я пытался:
https://github.com/visualfanatic/vue-svg-loader
но мне не хватает конкретной зависимости vue.
Я заметил, что есть один нюанс с использованием typescript, и вам нужно объявить файл определения типа. Тем не менее, я ...
Есть ответ!
Как я могу перенести свой синтаксис Vue 2 на Vue 3, потому что я получаю следующую ошибку:
TypeError: Vue-это не конструктор.
Прямо сейчас я использую Vue 3:
let app;
firebase.auth().onAuthStateChanged(user => {
console.log("user", user);
if (!app) {
app = new Vue({
router,
store,
render: h => h(App)
}).$mount("#app");
}
});
К
import { ...
Есть ответ!
Я относительно новичок в VueJS, и теперь я пытаюсь заменить
<script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>
около
<script src="https://unpkg.com/vue@next"></script>
Проблема в том, что предыдущий рабочий код был сломан после этого изменения:
<script>
window.addEventListener('load', () => {
const defaul...
Есть ответ!
Я пытаюсь следить за некоторыми предупреждениями в моем компоненте
import VueCompositionApi, { watch } from '@vue/composition-api';
import useWarning from '@composables/warnings';
Vue.use(VueCompositionApi);
setup () {
const { activeWarnings } = useWarning();
watch(activeWarnings, () => {
console.log('called inside on update')
});
}
В своей композиционной ф...
Есть ответ!
Как правильно визуализировать динамический комментарий в Vue 3? Я попробовал v-html, который не работает в моем случае, например, https://i.imgur.com/EtrVmGu.png
<template>
<!-- Method 1: not working properly, https://i.imgur.com/EtrVmGu.png -->
<template v-html="COMMENT" />
<!-- Method 2: does not solve the problem, print as string -->
{{ COMMENT }}
...
Есть ответ!
Я знаю, что подобные вопросы уже присутствуют в stackoverflow, но я до сих пор не могу понять, как это решить. У меня есть предупреждение(посмотрите в заголовке) в моей консоли.
Вы можете воспроизвести предупреждение следующим кодом
//index.js
import { createApp } from 'vue'
import { store } from './store'
import App from './App.vue'
import axios from 'axios';
const app = createApp(App)
app.__pr...
Есть ответ!
Использование API композиции Vue3. Как сделать так, чтобы он работал немедленно? Следующий код не работает.
watch((immediate=true) => props.isOpen, () => {
if (props.isOpen && props.preventBackgroundScrolling) {
document.body.style.setProperty('overflow', 'hidden')
} else {
document.body.style.removeProperty('overflow')
}
});
Есть ответ!
Я пытаюсь получить доступ к своим данным с помощью метода, который пишу, но он, похоже, не работает. Я получаю ошибку Ts2339 Typescript, говорящую о том, что свойство не существует в типе.
TS2339: Property 'players' does not exist on type '{ onAddPlayers(): void; getPlayerPlaceholder(index: number): string; }'.
47 | methods: {
48 | onAddPlayers() {
> 49 | this.games = p...
Есть ответ!
У меня есть массив, и я хотел бы поместить в него некоторые данные.
this.myArray.push(['a' => 'b']);
К сожалению, это не работает с Vue 3, так как myArray, по-видимому, обернут в прокси-объект.
Кто-нибудь знает, как нажать на массив в Vue 3?
Есть ответ!
Я развиваюсь вместе с Vue.js 3.0 и машинопись.
Я хочу определить перечисление, которое будет использоваться в нескольких компонентах.
Как и где я должен писать в файле?
Каталог
src/
├ components/
│ ├ ParentComponent.vue
│ └ ChildComponent.vue
└ App.vue
ChildComponent.Вью
<template>
<p>{{ color }}</p>
</template>
<script lang="ts">
import { defineComponen...
Есть ответ!
Я хотел бы обновить свой проект до vue3
Это приложение symfony, использующее vue в качестве независимых компонентов на лицевой стороне
Я никогда раньше не делал серьезного обновления и не слишком уверен, какой будет лучшая процедура ?
Должен ли я удалить vue2, а затем установить vue3 ?
должен ли я просто установить vue3 ?
должен ли я просто изменить свой package.json напрямую ?
"dependenci...
Есть ответ!
Я пытался реализовать Monaco Editor в приложении Vue 3,но не смог запустить web worker.
// Editor.vue
<template>
<div id="container">
<div id="editor-section"></div>
<button @click="runCode">Run</button>
</div>
</template>
<script>
import * as monaco from "monaco-editor";
import { onMounted ...