02 2021 档案
摘要：为什么选择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 install 和npm i 是一样的 --save 和 -S是一样的 --save-dev和-D是一样的 区别: -S,--save 安装包信息将加入到dependencies(生产阶段的依赖,也就是项目运行时的依赖,就是程序上线后扔然需要依赖) -D,--save-dev 安装包信息将加
阅读全文
摘要：非常容易忘记的问题点 npm i less-loader 时,一定不要忘记less npm i less-loader@7.2.1 -D ,这里一定要是低版本,因为为8.0.0会报错 一. webpack 能做什么? webpack是一个 静态模块打包器 1.语法转换 .less/sass 转换 c
阅读全文
摘要：yarn 如何安装 npm i yarn -g 1. 初始化 yarn init -y npm init -y 2.添加依赖 yarn add [package] yarn add [package]@[version] npm i [package] npm i [package]@[versio
阅读全文
摘要：请先查看 webpack 之 打包css文件(正确是查看 webpack 之 打包less文件) 一.创建文件夹,存放文件 1/images 2/存放pre.jpg图片(注:图片大小为3kb以下,原因后面会提到) 二.文件查看 修改了normal.css的样式内容 body { /* backgro
阅读全文
摘要：请先查看 webpack 之 打包css 一.创建文件 在src的css文件夹中添加文件 special.less 二.文件查看 @fontSize: 50px; @fontColor: orange; body { font-size: @fontSize; color: @fontColor;
阅读全文
摘要：一.javascript为什么是单线程? javascript从诞生起一个大特点就是单线程 js的单线程与它的用途有关.js主要用途是进行交互,以及操作DOM,所有这决定了只能是单线程,否则带来很复杂的同步问题.例如,有两个线程,一个线程操作DOM节点添加内容,另一个线程删除这个节点,这时候浏览器以
阅读全文
摘要：一.创建项目文件 二.文件内容 a.js import { num1, num2 } from "./b.js"; console.log(num1); b.js let num1 = 30; let num2 = 40; export { num1, num2 }; 三.执行命令 node a.j
阅读全文
摘要：一.如何创建一个案例项目文件 案例如图 二.说明 dist:是发布的文件夹 (webpack执行时的目标文件) src:开发时的文件夹 main.js 入口文件,这里一般是导入文件 index.html: 展示文件,会引用通过webpack打包生成的bundle.js pageage.json 包管
阅读全文
摘要：一.webpack打包css报错（已解决）：UnhandledPromiseRejectionWarning: TypeError: this.getResolve is not a function 问题解决:修改package.json中的内容 { "name": "k04", "version
阅读全文
摘要：一.pageage.json 注意点: 1/在生成该文件的时候,一定要注意文件夹不能包含特殊和中文字符 执行命令 : npm init -y 2/pageage.json文件内容: { "name": "meetwebpack", //名字 "version": "1.0.0", //版本 "des
阅读全文
摘要：需要下载第三方模块 art-template npm install art-template --save var template = require('art-template'); var html = template(__dirname + '/tpl.art', { user: { n
阅读全文
