首页 > 关于webpack+vue-router,在以.vue结尾的组件中导入js的问题

关于webpack+vue-router,在以.vue结尾的组件中导入js的问题

如图所示,我导入了js文件,webpack监听器没有报错,但是我下面这个方法却说是Myvalidate这个方法是未定义的,这个方法是写在form.js里面的。求各位大神帮忙看看。QAQ图片描述
var MyValidator = function() {

var handleSubmit = function() {  
    $('.form-horizontal').validate({  
        errorElement : 'span',  
        errorClass : 'help-block',  
        focusInvalid : false,  
        rules : {  
            name : {  
                required : true  
            },  
            password : {  
                required : true  
            },  
            intro : {  
                required : true  
            },
            short_name:{
                required : true
            }  
        },  
        messages : {  
            name : {  
                required : "Username is required."  
            },  
            password : {  
                required : "Password is required."  
            },  
            intro : {  
                required : "Intro is required."  
            },
            short_name : {
                required : "公司简称不能为空"
            }  
        },  

        highlight : function(element) {  
            $(element).closest('.form-group').addClass('has-error');  
        },  

        success : function(label) {  
            label.closest('.form-group').removeClass('has-error');  
            label.remove();  
        },  

        errorPlacement : function(error, element) {  
            element.parent('div').append(error);  
        },  

        submitHandler : function(form) {  
            form.submit();  
        }  
    });  

    $('.form-horizontal input').keypress(function(e) {  
        if (e.which == 13) {  
            if ($('.form-horizontal').validate().form()) {  
                $('.form-horizontal').submit();  
            }  
            return false;  
        }  
    });  
}  
return {  
    init : function() {  
        handleSubmit();  
    }  
};  

}();
module.exports = MyValidator;

  </div>
</div>

</div>
</template>

<script>
import form from '../../public/js/common/form.js';
import validate from '../../public/js/depend/validate/jquery.validate.js';
module.exports = {//默认导出,ES6
data () { //ES6,等同于data:function(){}

return {  
    classify:'',
    state:'',
    round:'',
    employee:'',
    tag:'',
    m_selected:'',
    s_selected:'',

    show:false,
    type:"date", //date datetime
    begin:"2015-12-20",
    end:"2015-12-25",
    x:0,
    y:0,
    range:false,//是否多选

}

},
methods :{

showCalendar:function(e){
e.stopPropagation();
var that=this;
that.show=true;
that.x=e.target.offsetLeft;
that.y=e.target.offsetTop+e.target.offsetHeight+8;
var bindHide=function(e){
    e.stopPropagation();
    that.show=false;
    document.removeEventListener('click',bindHide,false);
};
setTimeout(function(){
    document.addEventListener('click',bindHide,false);
},500);

},
},
components:{

    calendar: require('../common/calendar.vue')
},

ready:function(){
var _self=this;
MyValidator.init();
$.ajax({

      type: 'GET',
      url: '/company/dict',
      success: function(res){  
          console.log(res);
          _self.classify=res.dict.classify;
          _self.state=res.dict.state;
          _self.round=res.dict.round;
          _self.employee=res.dict.employee;
          _self.tag=res.dict.tag;
        },
      dataType: 'json'
    });

}
}
</script>
这是组件里js部分的内容


你一定是在开玩笑。

上面导入是这么写的:

import validate from '../../public/js/depend/validate/jquery.validate.js';

下面使用却用:

MyValidator.init();

哪里有MyValidator啊?你引入的变量不是叫validate么,那你好歹也得写成:

validate.init();

最后我要吐槽下你那个描述,也太潦草了,要先好好学习markdown

【热门文章】
【热门文章】