Vue.js
文章平均质量分 73
飞不起来的小菜鸟
飞不起来的小菜鸟
展开
-
Vue学习(二十二)路由器钩子和两种工作模式
路由器钩子和两种工作模式原创 2022-07-04 21:12:52 · 2308 阅读 · 0 评论 -
Vue学习(二十一)路由
Vue中的一个插件库,专门用来实现SPA(single page web application)应用原创 2022-07-02 16:03:42 · 341 阅读 · 0 评论 -
Vue学习(二十)vuex
专门在Vue中实现集中式状态(数据)管理的一个Vue插件,对Vue应用中多个组件的共享状态进行集中式管理(读/写),也是一种组件间通信方式,并且适用于任意组件简单通信。原创 2022-06-29 20:33:55 · 380 阅读 · 0 评论 -
Vue学习(十九)插槽
让父组件可以向子组件指定位置插入html结构,也是一种组件间的通信方式,适用于 父组件 ===> 子组件原创 2022-06-26 22:41:21 · 243 阅读 · 0 评论 -
Vue学习(十八)配置代理
配置代理解决请求跨域原创 2022-06-26 21:10:40 · 1132 阅读 · 0 评论 -
Vue学习(十七)nextTick和过度与动画
过度与动画写法样式准备:使用包裹要过度的元素,并配置name属性App组件Test组件Test2Test3TodoList 添加动画在MyItem中添加在MyList中添加原创 2022-06-19 13:45:04 · 225 阅读 · 0 评论 -
Vue学习(十六)消息订阅与发布(pubsub-js)
一种组件间的通信方式,适用于**任意组件间的通信**(使用pubsub-js插件),类似于全局事件总线原创 2022-06-18 17:53:40 · 999 阅读 · 0 评论 -
Vue学习(十六)全局事件总线(GlobalEvventBus)
一种事件间的通讯方式,适用于任意组件间的通讯(非官方api,是使用中总结出来的组合),需要符合以下两个要求,才能算是全局事件总线使用全局事件总线接收数据:A组件想要接收数据,则在A组件中给$bus绑定自定义事件,事件的回调在A组件自身提供数据:B组件想要给A组件提供数据,则在B组件中调用销毁main.jsApp组件School组件Student组件TodoList 全局事件总线修改App组件和MyItem组件的通讯main.is安装事假总线App组件使用数据MyItem原创 2022-06-18 16:58:59 · 287 阅读 · 0 评论 -
Vue学习(十五)组件的自定义事件
组件自定义事件,在父组件给子组件传入的自定义事假,事件回调写在父组件中。子组件中触发自定义事件,并且传送数据给父组件使用修饰符或 方法,使组件自定义事件只触发一次触发自定义事件解绑自定义事件组件上绑定原生DOM事件注意App组件Student组件...原创 2022-06-18 15:16:55 · 307 阅读 · 0 评论 -
Vue学习(十四)本地存储webStorage
存储内容大小一般在5MB左右(存储的key和value都是String的值),浏览器把数据存在本地或者会话中原创 2022-06-18 14:54:39 · 435 阅读 · 0 评论 -
Vue学习(十三)todoList小案例
对TodoList小案例的一个小总结原创 2022-06-12 22:53:17 · 258 阅读 · 0 评论 -
Vue学习(十二)标签、配置项和自定义插件
ref标签、props配置项、mixin混入和插件原创 2022-06-11 23:02:08 · 323 阅读 · 0 评论 -
Vue学习(十一)Vue CLI脚手架
Vue脚手架是Vue官方提供的标准化开发工具(开发平台)。参考文档CLI: command line interface 命令行接口工具第一步:进行全局安装,仅第一次执行(警告忽略)第二步:切换到需要创建项目的目录,使用命令行创建项目第三步:启动项目备注:render函数渲染页面的功能。替代完整版Vue中的模板解析器如果是一个单词命名的组件,在运行时报如下错误。解决方式为在vue.config.js中添加如下代码vue.config.js配置文件使用vue.config.js可以对脚手架进原创 2022-06-11 11:27:24 · 112 阅读 · 0 评论 -
Vue.js学习(十)非单文件组件和单文件组件
使用Vue.extend(option)进行定义,其中option和new Vue(option)几乎一样。只是在组件中不能写el配置项和data写成函数式,data写成函数式,是为了避免组件被复用时,数据存在引用关系。简写为const 组件名 = option;注册组件注册组件使用component配置项进行注册局部注册,是只有注册的Vue能使用该组件全局注册组件的使用在对应位置,使用注册组件时的组件名作为标签引入,或(不使用脚手架时,可能会导致后续组件不能...原创 2022-06-10 21:29:40 · 367 阅读 · 0 评论 -
Vue.js学习(九)生命周期
生命周期,又名生命周期回调函数、生命周期函数或生命周期钩子,是Vue在关键时刻调用的一些特殊函数。生命周期函数名称不可更改,但是函数内容可以根据需求进行编写。生命周期函数中的this指向vm或组件实例对象。......原创 2022-06-08 22:00:16 · 134 阅读 · 0 评论 -
Vue.js学习(八)- 过滤器和指令
过滤器、内置指令和自定义指令原创 2022-06-07 21:49:47 · 208 阅读 · 0 评论 -
Vue.js学习(七)- 列表排序和列表渲染
文章目录条件渲染列表渲染基本列表key的原理列表过滤列表排序条件渲染v-if1. 写法:v-if=“表达式”v-else-if=“表达式”v-else适用:切换频率较低的场景特点:直接移除DOM元素注意:v-if、v-else-if、v-else连用,但结果不能被打断v-show1. 写法:v-show=“表达式”2. 适用:切换频率较高的场景3. 特点:使用display进行隐藏和显示,仅仅是隐藏DOM元素使用v-if时,元素可能无法获取到,v-show可以获取原创 2022-05-31 21:32:30 · 434 阅读 · 0 评论 -
Vue.js学习(六)-绑定样式
文章目录绑定class样式绑定CSS样式绑定class样式class样式1. 写法:class=“xxx”,xxx可以是字符串、对象、数组2. 字符串写法适用于:类名不确定,需要动态获取3. 对象写法适用于:需要绑定多个样式,个数和名字不确定4. 数组写法适用于:需要绑定多个样式,个数和名字确定,但不确定用不用<!DOCTYPE html><html> <head> <meta charset="UTF-8" />原创 2022-05-28 23:24:12 · 288 阅读 · 0 评论 -
Vue.js学习(五)-计算和监视属性
文章目录计算属性监视属性普通监视深度监视简写watch和computed对比计算属性使用已有的属性去进行加工计算,生成一个全新的属性(简单理解)计算属性1. 定义:需要的属性不存在,需要通过已有的属性计算而来。2. 原来:底层借助了Object.defineProperty方法提供的setter和getter方法3. get函数的执行时机:(1). 初次读取时会执行一次(2). 当依赖的数据发生改变时会被再次调用4. 优势:与methods实现对比,计算属性内部有缓存机制,效率高,调试方原创 2022-05-28 22:07:15 · 233 阅读 · 0 评论 -
Vue.js学习(四)事件
目录数据代理Object.defineProperty事件处理绑定事件事件修饰符键盘事件数据代理Object.defineProperty数据代理的原理数据代理:通过一个对象对另外一个对象中属性的操作 let data = { x: 13 } let data2 = { y: 18 } Object.defineProperty(data2, 'x', { enumerable: true, // 控原创 2022-05-28 21:10:10 · 181 阅读 · 0 评论 -
Vue.js学习-模板语法和数据绑定
模板语法模板语法插值语法指令语法数据绑定单向数据绑定双向数据绑定el与data的两种写法el写法data写法模板语法插值语法功能:用于解析标签体内容写法:{{xxx}},xxx是js表达式,且可以读取到vue对象data中的的所有属性把data中的值插入到对应的地方<div id="root"> <h1>插值语法</h1> <h3>hello,{{name}}</h3></div> new Vue(原创 2022-05-28 16:04:49 · 299 阅读 · 0 评论 -
Vue.js学习-Vue.js Hello world
目录vue.js devtool插件安装取消开发者版本提示信息Hello World小案例vue.js devtool插件安装谷歌浏览器vue.js devtool插件安装,参考PHP中文网文章的方式安装取消开发者版本提示信息在JavaScript中添加Vue.config.productionTip = false;Vue.config.productionTip = false; // 阻止 vue 在启动时生成生产提示。Hello World小案例准备HTML文件并且引入vue.js原创 2022-05-28 15:26:21 · 305 阅读 · 0 评论 -
Vue.js学习-简介和下载vue.js
好久没有学习了,感觉脑袋都生锈了。天天看小说,刷视频的都有点腻了。还是储备点知识吧,让生锈的大脑计动一动。学学Vue.js·Vue是什么?官网:一套用于构建用户界面的渐进式JavaScript框架Vue的特点采用组件化模式,提高代复用率,让代码更好维护声明式编码,让代码人员无需直接操作DOM,提高开发效率使用虚拟DOM+D原创 2022-05-28 14:45:07 · 224 阅读 · 0 评论