随笔分类 - vue学习
摘要：1、可以在请求中添加跳转 myLogin(){ console.log(this.account+" "+this.accountPassword) if(this.account == '' || this.accountPassword == '') { console.log(this.acc
阅读全文
摘要：1、当Vue项目完成的时候，就需要部署到服务器上，首先，我们要修改config/index.js文件 assetsPublicPath: '/' 改为 assetsPublicPath: './'#注意，这个文件要改两处assetsPublicPath 2、运行 npm dev build ,把编译
阅读全文
摘要：1、watch属性使用案例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--cdn镜像快速导入Vue包--> <script src="https://cdn.bootcs
阅读全文
摘要：1、命名视图 routes:[ { path:'/',components:{ default:header, 'left':leftBox, 'main':mainBox } } ] 2、案例 <!DOCTYPE html> <html lang="en"> <head> <meta charse
阅读全文
摘要：1、路由嵌套 routes:[ { path:'/account', component:account, children:[ {path: '/login',component: login}, {path: '/register',component: register}, ] } 2、案例
阅读全文
摘要：1、ref获取Dom <!--ref除了引用元素之外，还可以引用组件以及组件方法、数据--> <h1 ref="h1">哈哈</h1> 引用：this.$refs.h1.innerText 2、案例 <!DOCTYPE html> <html lang="en"> <head> <meta char
阅读全文
摘要：1、组件传值练习以及浏览器缓存 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script
阅读全文
摘要：1、子组件向父组件传值步骤 1、父组件定义一个方法 methods:{ show(data){ this.fumsg = data; console.log("父组件数据"+data) } } 2、子组件通过事件绑定调用父组件方法 <!-- 父组件向子组件传递方法，使用事件绑定机制 v-on -->
阅读全文
摘要：1、父组件向子组件传值步骤 a) <!--父组件通过v-bind向子组件传值--> <com1 :parentmsg="msg"></com1>b) //把父组件传递过来的parentmsg属性，先在props数组中定义一下，才能使用父组件的数据//注意：组件中所有的props中的数据，都是通过父组
阅读全文
摘要：component案例： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--cdn镜像快速导入Vue包--> <script src="https://cdn.bootcss
阅读全文
摘要：1、钩子函数实现半场动画 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--cdn镜像快速导入Vue包--> <script src="https://cdn.bootcss
阅读全文
摘要：1、动画效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--cdn镜像快速导入Vue包--> <script src="https://cdn.bootcss.com/v
阅读全文
摘要：1、列表案例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 新 Bootstrap 核心 CSS 文件 --> <link href="https://cdn.stat
阅读全文
摘要：1、自定义按键修饰符 html标签内容 <!-- @keyup.enter 键盘监听 ，可以查看其他的按键值 --> name:<input type="text" class="form-control" v-model="name" @keyup.f2="btnAdd"> script标签内容
阅读全文
摘要：知识点： 1、全局过滤器：时间格式化 2、some ，indexOf ,filter等函数使用 3、自定义按键修饰符 @keyup.f2="btnAdd" Vue.config.keyCodes.f2 = 113 代码如下： <!DOCTYPE html> <html lang="en"> <hea
阅读全文
摘要：知识点： 1、vue基本代码结构 2、插值表达式 v-cloak v-text v-html v- bind(缩写为:) v-on(缩写为:@) v-model v-for v-if v-sow 3、事件修饰符 ：.stop .prevent .capture .self .once 1、基本代码结
阅读全文
摘要：1、父组件 <template> <div> <!--使用子组件标签，并定义变量--> <v-son :title='title' :homemsg='msg' :run='run' :home='this'></v-son> </div> </template> <script> import s
阅读全文
摘要：1、原型： 2、实现搜索功能代码 <template> <div class="safetyInfo"> <strong>用户名：</strong><input type="text" name="" id="username" placeholder="用户名" v-model="username
阅读全文
摘要：1、安装 npm install vue-resource --save 2、在main.js中添加 import VueResource from 'vue-resource' //全局注册 Vue.use(VueResource) 3、vue-resource发送请求 a）对象参数，post请求
阅读全文
摘要：1、打包运行的时候，过滤eslint语法检查，即报这个错的时候： Errors: 3 http://eslint.org/docs/rules/indent You may use special comments to disable some warnings. Use // eslint-di
阅读全文
