Vue.js scoped样式
摘要：视频 scoped样式 作用：让样式在局部生效，防止冲突。 写法：<style scoped> #components ##School.vue <template> <div class="demo"> <h2 class="title">学校名称：{{name}}</h2> <h2>学校地址：{
阅读全文
posted @
2023-03-18 16:30
垂序葎草
阅读(20)
推荐(0) 编辑
Vue.js 插件
摘要：视频 插件 功能：用于增强Vue 本质：包含install方法的一个对象，install的第一个参数是Vue，第二个以后的参数是插件使用者传递的数据。 定义插件： 对象.install = function (Vue, options) { // 1. 添加全局过滤器 Vue.filter(....
阅读全文
posted @
2023-03-18 16:18
垂序葎草
阅读(28)
推荐(0) 编辑
Vue.js mixin混入
摘要：视频 mixin(混入) 功能：可以把多个组件共用的配置提取成一个混入对象 使用方式： 第一步定义混合： { data(){....}, methods:{....} .... } 第二步使用混入： 全局混入：Vue.mixin(xxx) 局部混入：mixins:['xxx'] #compo
阅读全文
posted @
2023-03-18 16:03
垂序葎草
阅读(21)
推荐(0) 编辑
Vue.js props配置（微信收款确认流程）
摘要：视频 直接修改外来数据props会产生警告 props配置项 1. 功能：让组件接收外部传过来的数据 2. 传递数据：```<Demo name="xxx"/>``` 3. 接收数据： 1. 第一种方式（只接收）：```props:['name'] ``` 2. 第二种方式（限制类型）：```pro
阅读全文
posted @
2023-03-18 15:48
垂序葎草
阅读(31)
推荐(0) 编辑
Vue.js ref属性（类比id）
摘要：视频 1. 被用来给元素或子组件注册引用信息（id的替代者） 2. 应用在html标签上获取的是真实DOM元素，应用在组件标签上是组件实例对象（vc） 3. 使用方式： 1. 打标识：```<h1 ref="xxx">.....</h1>``` 或 ```<School ref="xxx"></Sc
阅读全文
posted @
2023-03-18 15:26
垂序葎草
阅读(94)
推荐(0) 编辑
Vue.js 修改默认配置（main.js改变，vue.config.js改变）
摘要：视频 使用vue inspect > output.js可以查看到Vue脚手架的默认配置。 使用vue.config.js可以对脚手架进行个性化定制，详情见：https://cli.vuejs.org/zh main.js改变对应的下列中的entry后面的main.js也要改变 ###vue.con
阅读全文
posted @
2023-03-18 15:24
垂序葎草
阅读(314)
推荐(0) 编辑
Vue.js 单文件组件
摘要：视频 安装vetur vue代码高亮 没安装脚手架的时候，浏览器不认ES6标准 #HTML <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>练习一下单文件组件的语法</title> </head> <body> <!-- 准
阅读全文
posted @
2023-03-17 21:05
垂序葎草
阅读(16)
推荐(0) 编辑
Vue.js 非单文件组件-一个重要的内置关系
摘要：视频58 视频59 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>一个重要的内置关系</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue
阅读全文
posted @
2023-03-17 20:34
垂序葎草
阅读(19)
推荐(0) 编辑
Vue.js 非单文件组件-VueComponent构造函数
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>VueComponent</title> <script type="text/javascript" src="../js/vue.js"></script> </he
阅读全文
posted @
2023-03-17 20:00
垂序葎草
阅读(13)
推荐(0) 编辑
Vue.js 非单文件组件-组件的嵌套
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>组件的嵌套</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></scri
阅读全文
posted @
2023-03-17 19:45
垂序葎草
阅读(13)
推荐(0) 编辑
Vue.js 非单文件组件-几个注意点
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>几个注意点</title> <script type="text/javascript" src="../js/vue.js"></script> </head> <bo
阅读全文
posted @
2023-03-17 19:37
垂序葎草
阅读(10)
推荐(0) 编辑
Vue.js 非单文件组件-基本使用
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>基本使用</title> <script type="text/javascript" src="../js/vue.js"></script> </head> <bod
阅读全文
posted @
2023-03-17 18:17
垂序葎草
阅读(25)
推荐(0) 编辑
Vue.js 生命周期-总结生命周期
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>引出生命周期</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></scr
阅读全文
posted @
2023-03-17 17:31
垂序葎草
阅读(24)
推荐(0) 编辑
Vue.js 生命周期-分析生命周期
摘要：[挂载流程视频49](https://www.bilibili.com/video/BV1Zy4y1K7SH?p=49&spm_id_from=pageDriver&vd_source=009479c86159d637f652d9b02ff7815d) [更新流程视频50](https://www.
阅读全文
posted @
2023-03-17 16:44
垂序葎草
阅读(11)
推荐(0) 编辑
Vue.js 生命周期-引出生命周期
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>引出生命周期</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></scr
阅读全文
posted @
2023-03-17 15:57
垂序葎草
阅读(17)
推荐(0) 编辑
Vue.js 自定义指令 函数式&对象式
摘要：视频45 视频46 视频47 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>自定义指令</title> <script type="text/javascript" src="../js/vue.js"></script>
阅读全文
posted @
2023-03-17 15:43
垂序葎草
阅读(20)
推荐(0) 编辑
Vue.js 内置指令 v-pre指令
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>v-pre指令</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></sc
阅读全文
posted @
2023-03-17 15:39
垂序葎草
阅读(44)
推荐(0) 编辑
Vue.js 内置指令 v-once指令
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>v-once指令</title> <!-- 引入Vue --> <script type="text/javascript" src="../js/vue.js"></s
阅读全文
posted @
2023-03-17 15:04
垂序葎草
阅读(27)
推荐(0) 编辑
Vue.js 内置指令 v-cloak指令
摘要：视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>v-cloak指令</title> <style> [v-cloak]{ display:none; } </style> <!-- 引入Vue --> </head>
阅读全文
posted @
2023-03-17 02:16
垂序葎草
阅读(42)
推荐(0) 编辑
