VUE学习笔记
文章平均质量分 69
vue学习过程中的一些记录与感悟。
FWKC
这个作者很懒,什么都没留下…
展开
-
十三、商城项目练习
商城项目练习 一、目录结构组织 二、别名配置 //vue.config.js module.exports = { configureWebpack: { resolve: { alias: { 'assets': '@/assets', 'common': '@/common', 'network': '@/network', '原创 2021-09-30 15:18:22 · 101 阅读 · 0 评论 -
十二、git
git 一、常用命令 git status 查看哪些没有上传 git add . 提交至本地缓冲区 git commit -m “初始化仓库” 将代码提交至本地仓库 git push 上传至远端 git branch 查看分支 git clone xxxx 下载项目 push.default 设置按同名方式进行项目提交 git push 将代码从本地提交到远程 git pull 将远程主机的master分支最新内容拉下来后与当前本地分支直接合并 fetch+merge原创 2021-09-30 15:17:26 · 56 阅读 · 0 评论 -
十一、axios
axios 一、发送请求的方式 二、安装及使用 npm install axios --save //使用 //http://123.207.32.32:8000/home/multidata get测试地址 //http://123.207.32.32:8000/home/data?type=pop&page=1 //http://123.207.32.32:8000/home/data?type=sell&page=1 import axios from 'axios' asio原创 2021-09-30 15:16:53 · 61 阅读 · 0 评论 -
十、Vuex
Vuex 需要多个组件共享的组件状态可以通过Vuex进行管理 一、安装 npm install vuex --save 创建vuex实例 创建一个store的文件夹 创建一个index.js文件 import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state:{ //保存状态 }, mutations: { //方法,原创 2021-09-30 15:16:13 · 63 阅读 · 0 评论 -
八、TabBar案例
TabBar案例 一、APP.vue中的样式引用 <style> @import "./assets/css/base.css" </style> base.css内容,无边框 bady { padding: 0; margin: 0; } 二、tabbar的高度为49px 三、js判断tabbar是不是被激活的状态 this.$route.path.indexOf(this.path) !== -1 四、 激活及激活后文字颜色的判定 通过父组件向子组件传递颜色参原创 2021-09-14 09:07:03 · 86 阅读 · 0 评论 -
九、promise使用
promise使用 一、使用场景 promise可以对异步函数进行优雅的操作,解决回调地域的问题,可以对异步操作的代码进行封装 二、基本使用 new Promise((resolve, reject) => { setTimeout(() => { resolve('helloword') },1000) reject('error message')//处理失败时调用的函数 }).then((data) => { //对第一次异步原创 2021-09-14 09:07:43 · 88 阅读 · 0 评论 -
七、Vue-Router
Vue-Router 一、改变url,页面不刷新 更改url的hash location.hash = 'aaa' html5中的history对象,该方法可以按栈规则返回前一链接(先进后出) history.pushState({},'','home') history.back() 可以返回上一连接 history.go(-1)等同于history.back history.forwary == histiry.go(1) 向前 history的replaceState,该原创 2021-09-10 17:23:44 · 93 阅读 · 0 评论 -
六、脚手架Vue CLI基础
脚手架Vue CLI基础 一、前提先安装node、npm,镜像配置 npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm install [name] 二、安装脚手架(例子用的3.2.1版本) npm install -g @vue/cli 为了可以使用脚手架3和脚手架2的功能,需要拉一个架手架2的模板 npm install @vue/cli-init -g 三、初始化项目 脚手架2 vue init web原创 2021-09-10 17:22:54 · 81 阅读 · 0 评论 -
五、webpack基础
webpack基础 一、安装 webpack基于node环境 使用npm安装3.6.0,用于手动配置管理学习,后期可以安装新版本 npm install webpack@3.6.0 -g //全局安装 npm install webpack@3.6.0 --save-dev //开发时依赖 二、起步 项目中一般包含两个文件:src用来存放源码,dist打包的东西存放位置 打包命令main.js是需要打包的js,bundle.js是打包成的js webpack main.js bundle.原创 2021-09-09 17:57:55 · 80 阅读 · 0 评论 -
四、模块化开发概念
模块化开发 一、ES6模块开发基础,数据的导入和导出 script进行引用时,要增加type="module"属性 在js文件中对需要在外部引用的属性及方法进行导出,通过export{} 在引用的js文件中import{} from “*.js” 也可以直接导出/导入函数和类,ES6中定义类的方式class persion(){}. export default 可以导出一个不命名的功能,导入者可以自行命名。 ...原创 2021-09-09 09:12:03 · 67 阅读 · 0 评论 -
三、Vue插槽slot的用法
插槽slot 一、基本使用 使组件具备扩展性 <div id = 'app'> <cpn1><p>11111</p></cpn1> <cpn1><button>按钮</button></cpn1> </div> <template id = 'cpn'> <div>原创 2021-09-09 09:10:36 · 137 阅读 · 0 评论 -
二、Vue组件化
二、Vue组件化 1. 注册组件步骤 创建逐渐构造器,extend() 注册组件,component() 使用组件 2. 基本使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> </head> <body> <div id = "app"> <my-cpn></my-cpn>原创 2021-09-07 21:04:04 · 53 阅读 · 0 评论 -
一、Vue基础
Vue基础 1.js6 变量定义使用 let 定义变量 const 定义常量 2.基本格式 <div id = "app"></div> <script src="../js/vue.js"></script> <script> //let(变量)、const(常量) const app = new Vue({ el: '#app',//用于挂载要管理的元素 date: { //用于定义数据原创 2021-09-06 18:05:50 · 139 阅读 · 0 评论