随笔分类 - vue
摘要：Vue中ref和$refs的介绍及使用
阅读全文
摘要：如下图 在这个马路上,有一辆bus在来回的接送,从a发布bus.$emit('aaa'),然后在c订阅bus.$on('aaa') 实例案例代码 app.vue <template> <div id="app"> <big-son></big-son> <hr /> <small-son></sma
阅读全文
摘要：为什么选择axios?作者推荐和功能特点 作者在2016年11月发微博:vue-resource不在为官方推荐的ajax库,推荐使用axios 功能特点: 在浏览器中发送XMLHttpRequests请求 在node.js中发送http请求 支持Promise API 拦截请求和响应 转换请求和响应
阅读全文
摘要：vuex作用 vuex就是为了提供这样一个在多个组件间共享状态的插件 vuex管理什么状态呢? 例如:用户的登录状态,用户名称,头像,地理位置信息等 例如商品的收藏,购物中的物品等等 这些状态信息,可以放在统一的地方,对它进行保存和管理,而且还是响应式的 安装vuex包 npm install vu
阅读全文
摘要：$event: 事件对象,作为传参 $emit("my-click") , 触发自定义事件 这个my-click事件要在 父组件中的子组件自己上写 $router:代表的是 new VueRouter this.$router.push("/home");//可以访问某个路由 浏览器有返回 this
阅读全文
摘要：(1) 文本插值 {{}} {{ 表达式(有返回值) }} (2) v-bind 一般用在属性上 1> <innput type="text" :value="val"> 2><img :src="url"/> url:'../assets/logo.png' 会出现图片不显示问题 src: req
阅读全文
摘要：一.过滤器 (1)全局使用 1> 添加moment 模块 npm i moment 2> 在main.js中 通过 Vue.fileter 定义一个全局的过滤器 import moment from "moment"; Vue.filter("date", (val, type = "YYYY-MM
阅读全文
摘要：生命周期函数:是由vue框架提供的内置函数,会伴随着组件的生命周期,自动按次序执行. vue组件的生命周期函数,可以分为三大类: 第一个阶段:初始化阶段 1>beforeCreate (vue实例初始化) 2>created (初始化完成,发送ajax) 3>beforeMount (模版和数据结合
阅读全文
摘要：(1)基本的搭建 1>vue init webpack tabbar 搭建的是2.x版本的项目 2>思考:样式如何放? 1: index.js 中 import './assets/css/base.css' 文件 该文件本身在打包时会被引用到App.vue文件中,所有不建议这样做 2:App.vu
阅读全文
摘要：优势 传统的多页面应用程序，每次请求服务器返回的都是一整个完整的页面 单页面应用程序只有第一次会加载完整的页面 以后每次请求仅仅获取必要的数据，减少了请求体积，加快页面响应速度，降低了对服务器的压力 SPA更好的用户体验，运行更加流畅 缺点 开发成本高 (需要学习路由) vue-router rea
阅读全文
摘要：报错问题:TypeError: this.getOptions is not a function 如何解决:安装 less-loader低版本的就行 npm i less-loader@5.0.0 2.一种就是 less-loader 是依赖于less的,所以一定要有less-loader les
阅读全文
摘要：一.认识路由 1.路由:就是通过互联的网络吧信息从源地址输到目的地的活动 --维基百科 2.后端路由阶段: 一个页面有自己对应的网址,即url,url会发送到服务器 ,服务器通过正则对该url进行匹配,并最后交给一个controller进行处理,controller最终生成html或者数据,返回给前
阅读全文
摘要：一.认识Vue CLI3 (1)vue-cli3与2版本有很大的区别 1>vue-cli3是基于webpack 4打造的,vue-cli2还是webpack 3 2>vue-cli3的设计原则是0配置,移除的配置文件根目录下的,build 和config等目录 3>vue-cli3提供了vue ui
阅读全文
摘要：一.看图,查看代码区别 二.如图,进行分析 (1)runtime-compiler和runtime-only的执行步骤 runtime-compiler: teplate -> ast -> render ->vdom ->UI runtime-only : render ->vdom -> UI
阅读全文
摘要：目录结构分析 1.build文件夹和config文件夹都是用来进行配置的(是关于webpack的配置) config文件中有一个index.js文件 useEslint:true 修改为false 就可以关闭eslint 2.如何去读文件,通过脚手架创建项目后,一般是通过查看pageage.json
阅读全文
摘要：一.安装 (1)若已经安装旧版的vue-cli(1.x 或 2.x) 你需要先通过以下方式卸载 npm uninstall vue-cli -g yarn global remove vue-cli (2)vue3.x安装 npm i -g @vue/cli yarn global add @vue
阅读全文
摘要：一.认知 vue create 项目名 是vue-cli3.x的初始化方式,目前模板是固定的,模板选项可自由配置 vue init webpack 项目名是 vue-cli2.x的初始化方式 如何将vue-cli2.x项目向3.迁移只需要把static目录赋值到public目录下,老项目的src目录
阅读全文
摘要：一.认识plugin 1.plugin是什么? plugin是插件的意思,通常用于对现有架构进行扩展 webpack中的插件,就是对webpack现有功能的各种扩展,比如打包优化,文件压缩等等 2.loader和plugin区别 loader主要用于转换某些类型的模块,它是一个转换器 plugin是
阅读全文
摘要：注意点:vue在发布构建的时候有两类版本 1/runtime-only =>代码中不可以有任何的template 2/runtime-compiler => 代码中,可以有template,因为有compiler可以用于template的编译 一.如何配置 (1)添加以上文件 index.html
阅读全文
摘要：非常容易忘记的问题点 npm i less-loader 时,一定不要忘记less npm i less-loader@7.2.1 -D ,这里一定要是低版本,因为为8.0.0会报错 一. webpack 能做什么? webpack是一个 静态模块打包器 1.语法转换 .less/sass 转换 c
阅读全文
