vue中使用vue-validator表单验证插件报错。

在vue中使用vue-validator进行表单验证,已经通过npm安装,并且在入口文件main.js中进行了注册,但是在组组件中使用的时候老是报没有注册的错:
代码:

`import Vue from 'vue';
import 'babel-polyfill';
import FastClick from 'fastclick';
import vueValidator from 'vue-validator';
import router from './router/router';
import App from './App.vue';
import axios from './config/axiosBase';
import util from './common/js/utils';
import BaseInfo from './common/js/baseInfo';
import './common/style/index.less';
import { LoadingPlugin } from 'vux';
import { AlertPlugin } from 'vux';
import { ConfirmPlugin } from 'vux';
import weixin from 'wx';

Vue.use(LoadingPlugin);
Vue.use(AlertPlugin);
Vue.use(ConfirmPlugin);
Vue.use(vueValidator);
FastClick.attach(document.body);`

组件中使用代码如下:
<validator  name="getNoValidation">  
                <form novalidate>
                    <div class="queue-info">    
                        <div class="form-group">
                            <label class="control-label">姓名</label>
                            <div class="input-control">
                                <input type="text" 
                                    v-model="personName" 
                                    class="form-control" 
                                    v-validate:name="['required']" placeholder="必填">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">性别</label>
                            <div class="input-control gender-check">
                                <checker v-model="sex" default-item-class="checker" selected-item-class="checked">
                                    <checker-item id="male" value="male"></checker-item><label for="male" class="m-r-dis">女士</label>
                                    <checker-item id="female" value="female"></checker-item><label for=" female">先生</label>
                                </checker>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label">手机号</label>
                            <div class="input-control">
                                <input type="text" v-model="phone" class="form-control" placeholder="必填">
                            </div>
                        </div>
                    </div>
                    <div class="people-num">
                        <h1 class="title">就餐人数</h1>
                        <div class="picker">
                            <checker v-model="personRelNum" selected-item-class="item-selected">
                                <checker-item class="checker-item" :value="item" v-for="item in peopleNum" :key="item">{{item}}</checker-item>
                                <checker-item class="checker-item more" value="hide"  @click.native="openMore" v-if="numControl !==20">更多</checker-item>
                            </checker>
                        </div>
                    </div>
                    <div class="errors">
                        <p v-if="$getNoValidation.name.required">必须填写姓名</p>
                    </div>
                    <div class="btn-foot">
                        <button type="button" class="btn-cancel border-1px-right" @click="isShow = !isShow">取消</button>
                        <button type="submit" class="btn-sure">确定</button>
                    </div>
                </form>
                </validator> 
                

都是按着文档姿势来的,可是就给我抛锚:

clipboard.png

求大神指导正确姿势!!!

阅读 4.5k
2 个回答

$getNoValidation 这个属性或方法没有声明

这样做:

// Example.vue
<template>...</template>

<script>
export default {
    data () {
        return {
            $getNoValidation: {
                // ...
            }
        }
    }
}
</script>
新手上路,请多包涵

解决了吗,我也报同样的错误,完全按照github上来的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题