时间戳

首页 > 解决方案 > 如何正确配置 vuelidate？

vue.js - 如何正确配置 vuelidate？

问题描述

使用最新版本的 Vue

我一直在努力让 Vuelidate 工作

我在互联网上看到的每个指南都使用这种类型的“Main.js”代码： import Vue from 'vue';

import Vuelidate from 'vuelidate';

import App from './app/App';

Vue.use(Vuelidate);

new Vue({
    el: '#app',
    render: h => h(App)
});

虽然我的 main.js 看起来像这样：

import { createApp } from 'vue'
import App from './App.vue'


createApp(App).mount('#app')

尝试在我的组件中使用如下：

 import { required, email } from '@vuelidate/validators'
  import {useVuelidate} from "@vuelidate/core";

    export default {
data: () => ({
    v$: useVuelidate(),

尝试像这样实现它：

<div v-if="submitted && !$v.validations.affiliate.required"></div>

收到此错误：无法解析 v$ 的类型

标签： vue.jsvuelidate

解决方案

import { createApp } from 'vue'
import App from './App.vue'
import Vuelidate from 'vuelidate'

createApp(App).use(Vuelidate).mount('#app')

推荐阅读