VUE
关注
分享
扫一扫
VUE
小森呀
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
ES6基础
声明变量的方式： var 声明变量，存在变量提升 属于顶层对象的属性 function - 属于顶层对象的属性 let 声明变量，不存在变量提升 不属于顶层对象的属性 const 声明常量，不可修改常量的内存地址 不属于顶层对象的属性 class - 不属于顶层对象的属性 import - - 顶层对象 浏览器 window node global 运算符 扩展运算符 ......原创 2021-11-28 16:29:33 · 193 阅读 · 0 评论 -
vue基础
{{}} 插值 el 挂载点（双标签，不能为html和body） data 数据 methods 方法，方法内部this指向data v-text 设置文本 v-html 设置文本 v-on:事件名="方法" 绑定事件 @事件名="方法" 绑定事件，简写 @keyup.enter ...原创 2021-04-21 22:42:46 · 170 阅读 · 0 评论 -
computed与watch
完整写法： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />原创 2021-10-19 23:10:32 · 148 阅读 · 0 评论 -
key的作用及原理
作用： key是虚拟DOM对象的标识，当数据发生变化时，Vue会根据[新数据]生成[新的虚拟DOM]，随后Vue进行[新虚拟DOM]与[旧虚拟DOM]的差异比较 原理（比较规则）： 1.旧虚拟DOM中找到了与新虚拟DOM相同的key: a.若虚拟DOM中内容没变，直接使用之前的直DOM! b.若虚拟DOM中内容变了，则生成新的真实DOM，随后替换掉页面中之前的真实DOM。 2.旧虚拟DOM中...原创 2021-10-31 15:09:01 · 2843 阅读 · 0 评论 -
class与style
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.原创 2021-10-31 11:58:31 · 273 阅读 · 0 评论 -
render
render(createElement) { return createElement("h1", "你好"); }, render: (createElement) => createElement("h1", "你好"), render: (h) => h("App"),原创 2021-11-07 16:49:56 · 124 阅读 · 0 评论 -
props的写法
第一种： props: ["name", "sex", "age"] 第二种： props:{ name:String, sex:String, age:Number } 第三种： props: { name: { type: String, required: true,//是否必要性 }, sex: { type: String, default: "男",//没参数时的默认值 }原创 2021-11-07 21:20:22 · 308 阅读 · 0 评论 -
vue插件
1.创建插件（一个js文件） export default { install(Vue,参数...) { // 插件内容 }, }; 2.使用插件 Vue.use("插件名",参数...);原创 2021-11-07 21:44:51 · 125 阅读 · 0 评论 -
vue插槽
基本使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> &原创 2021-11-13 19:50:58 · 690 阅读 · 0 评论 -
vue生命周期
vue生命周期 beforeCreate 实例初始化前 无法访问到data中的数据和methods中的方法 created 实例初始化后 可以访问到data中的数据和methods中的方法 beforeMount 实例挂载前 页面呈现的是未经vue编译的dom结构，对dom的操作不奏效 mounted 实例挂载后 页面呈现的是经过vue编译的dom结构，对dom的操作奏效 beforeUpdate 数据更新前 此时数据是新的，页面原创 2021-11-21 12:08:38 · 262 阅读 · 0 评论 -
VueComponent(组件)
1.组件的本质是一个名为VueComponent的构造函数，由vue.extend生成 2.vue解析组件标签时会创建组件的实例对象 3.每次调用vue.extend，返回的都是一个全新的VueComponent 4.this指向 a.组件配置中，data、methods、watch、computed中的函数的this均是指向VueComponent实例对象 b.vue配置中，data、methods、watch、computed中的函数的this均是指向Vue实例对象 Vue与...原创 2021-11-21 15:51:59 · 768 阅读 · 0 评论 -
router基础
<router-link active-class="" to=""></router-link> router导航 <router-view></router-view> router展示 router配置 import Vue from "vue"; import VueRouter from "vue-router"; import A from "../components/A.vue"; import B from "../c原创 2021-11-14 11:44:05 · 695 阅读 · 0 评论 -
vue-cli
1、下载安装nodejs（cmd中node -v查看版本号） 2、使用淘宝镜像加速下载（$符号不要,下载后可以使用cnpm） 3、npm i -g vue（全局下载vue，在C盘） 4、npm i -g vue-cli 5、vue init webpack feicui（创建一个项目，下载vue-route处选yes，下载相关依赖处选择自己下载） 6、cd feicui 进入项目中 7、npm i 下载项目中package.json中的相关依赖 8、npm run dev 运行项目 npm.原创 2020-06-20 13:59:58 · 172 阅读 · 0 评论 -
defineProperty给对象追加属性
方法一 <script> let number = 20; let man = { name: "张三", sex: "男", }; Object.defineProperty(man, "age", { value: number, enumerable: true, //控制添加的内容是否参与遍历 writable: true, //控制添加的内容是否可以修改 configurable原创 2021-09-25 00:25:53 · 236 阅读 · 0 评论 -
vue组件通信
访问自己的data数据 Vue.component("my", { template: "#an", data() { return { h1: "我是标题", }; }, });原创 2021-05-05 22:58:22 · 188 阅读 · 0 评论 -
less基础
注释 & 变量混合 合并属性 命名空间 引入@import (参数) “文件” once 只包含一次，默认 reference 引用less文件但不输出 inline 引用less文件但不进行操作 less 无论是什么格式的文件都把他作为less文件操作 css 无论是什么格式的文件都把他作为css文件操作 multiple 允许引入多次相同文件名的文件 函数 字符串函数 数学函数 ceil()...原创 2021-08-27 22:51:43 · 116 阅读 · 0 评论 -
git基础
远程库 git remote 查看远程仓库别名 git remote -v 查看远程库别名 git remote add 别名 远程库http链接 创建远程库别名 git push 远程库别名 分支名 将分支推送到远程库 git pull 远程库别名 分支名 将分支从远程库拉取到本地（会合并分支） git fetch 远程库别名 分支名 将分支从远程库抓取到本地 git fetch --all 将远程库所有分支抓取到本地 git clo原创 2021-08-17 23:23:20 · 120 阅读 · 0 评论 -
vue数据代理
<script> //原数据 var data = { name: "Andy", }; // 数据收集 var _data = data; // 数据代理 var vm = {}; Object.defineProperty(vm, "name", { set(value) { _data.name = value; }, get() { retu..原创 2021-05-16 18:41:37 · 128 阅读 · 0 评论 -
v-model双向绑定原理
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.原创 2021-05-07 23:28:51 · 143 阅读 · 0 评论 -
Vue-Router
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <tit.原创 2021-05-25 23:46:32 · 130 阅读 · 0 评论 -
vue组件访问
父组件访问子组件 el作用范围内必须有子组件注册的标签存在 this.$children不建议使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="wid.原创 2021-05-06 00:33:26 · 164 阅读 · 0 评论 -
vue组件
1.全局组件 // 创建组件构造器 var an = Vue.extend({ template: `<h1>我的</h1>`, }); // 注册组件，在vue实例范围中使用<my></my> Vue.component('my',an) 2.局部组件 // 创建组件构造器 var an = Vue.extend({ template: `<h1>我的</h原创 2021-05-04 14:04:57 · 152 阅读 · 0 评论