1. weex最新版如何将.vue编译成.js文件
1.components 目录新建validate.js：
export default{
install(Vue){
Vue.prototype.$myName = "zhagngsan";
}
}
我插件定义属性
2.入口文件jssrc/index.js 加入：
// 引入
import validate from "./../components/validate";
// 使用
Vue.use(validate);
3.我user-username.vue 组件验证:
mounted(){
alert(this.$myName);
},
浏览器访问登录页面功弹：
写图片描述
4.刚刚我已经插件定义属性马何定义：
export default{
install(Vue){
// Vue.prototype.$myName = "zhagngsan";
Vue.prototype.checkUserName = (value) => {
if(/\w{6,20}/.test(value)){
return true;
}else{
return false;
}
}
}
}
同使用该：
if(this.checkUserName("hello")){
alert("ok");
}else{
alert("error");
}
5.
写图片描述
我修改user-name.vue 组件实现文本框验证：
用户名
用户合
写图片描述
自定义指令
文档：
1、validate.js:
export default{
install(Vue){
// Vue.prototype.$myName = "zhagngsan";
Vue.prototype.checkUserName = (value) => {
if(value == ""){
return true; // 没填写,默认true
}
if(/\w{6,20}/.test(value)){
return true;
}else{
return false;
}
}
Vue.directive("uname",{
bind(){
console.log("bind"); // 调用
},
update(el,binding,vnode){
console.log(el);
console.log(binding);
console.log(vnode);
},
})
}
}
2、我自定uname 指令面看何使用
我组件模板使用 v-uname 并且给绑定username数据
我打浏览器控制台：
写图片描述
说明我定义指令执行：
bind(){
console.log("bind"); // 调用
},
3、面我看update 东东
update(el,binding,vnode){
console.log(el);
console.log(binding);
console.log(vnode);
}
2. volar怎么快速生成vue模板
配置自定义的snippets。
通过vscode的snippets我们可以自己配置自定义的snippets，从而实现快捷生成代码片段，在VsCode里按F1，输入snippets->选择配置用户代码片段，选择后出现选择配置的界面，这里我们对Vue文件的代码片段进行配置，然后就完成了。
随着vscode以及vue的越来越普及，vetur这个名字也越来越被人熟知。vetur是一个vscode插件，用于为.vue单文件组件提供代码高亮以及语法支持。