
Vue.js学习笔记
学习Vue二三事儿...
碧山云游
Life sometimes is boring,so i sometimes do some boring thing to avoid it
展开
-
Vue.js watch 示例代码,用于表单的校验
<template> <div id="app"> <div id = "computed_props"> Kilometers : <input type = "text" v-model = "kilometers"> Meters : <input type = "text" v-model = "meters"> </div></div></template&g.原创 2021-11-29 20:38:47 · 623 阅读 · 0 评论 -
Vue.js中的插槽
匿名插槽 具名插槽 作用域插槽子组件:<template> <div :class="['my-btn',btnStyle]"> {{btnText}} <div> <!--匿名slot --> <slot></slot> <!-- 具名slot --> <slot name="slot1"></slot&原创 2021-11-28 21:49:52 · 581 阅读 · 0 评论 -
uniapp编写tab选项卡
项目演示结果:项目结构:项目代码1.index.vue<template> <div id="app"> <tabs :currentIndex="currentIndex" @changTab="changeTabHandler"> <tab tabName="tab1" index="1"> <div>内容1</div> </ta..原创 2021-11-21 22:18:19 · 3534 阅读 · 0 评论 -
vue中 image v-bind:src
<template> <view> <image v-bind:src="'../../static/' + joke.avatar" /> </view></template><script> export default { data() { return { joke: { avatar: 'logo.png' } } }, methods: { .原创 2021-11-06 16:20:52 · 411 阅读 · 0 评论 -
Vue中的样式穿透
想要改变插件里组件的样式?使用样式穿透!【Vue】详解Vue中的样式穿透>>>原创 2021-10-30 21:00:32 · 232 阅读 · 0 评论 -
vue-cli
vue-cli是快速搭建一个vue框架环境的的工具,常把它叫做脚手架,它让你在开发vue项目时可以迅速开始开发,开箱即用。看一下百度百科的解释,脚手架这个名字是十分的贴切的。脚手架https://baike.baidu.com/item/%E8%84%9A%E6%89%8B%E6%9E%B6/4361782?fr=aladdinelementUIhttps://www.bilibili.com/video/BV1x64y1S7S7?p=40...原创 2021-10-07 16:53:46 · 108 阅读 · 0 评论 -
v-slot
v-slot就是父组件向子组件传递信息的,是信息的一个出口。v-slot详解https://www.bilibili.com/video/BV1MU4y1n7j9?spm_id_from=333.999.0.0原创 2021-10-07 16:45:01 · 549 阅读 · 0 评论 -
Vue之JavaScript基础(闭包与原型链)
Vue之JavaScript基础(闭包与原型链)https://blog.youkuaiyun.com/weixin_43631810/article/details/103629190转载 2021-09-25 21:11:29 · 230 阅读 · 0 评论 -
Vue综合案例:自定义指令,生命周期,v-resource请求
<!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"> <title>品牌.原创 2021-06-14 18:53:07 · 205 阅读 · 0 评论 -
Vue.js的模板渲染
Vue:{{ data }}:模板 / 绑定 / 渲染 / 响应式转载 2021-05-22 14:56:54 · 218 阅读 · 0 评论 -
Vue中计算属性的使用
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>常用特性</title.原创 2021-05-19 23:18:10 · 522 阅读 · 0 评论 -
Vue中自定义指令
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>常用特性</title.原创 2021-05-19 23:16:36 · 194 阅读 · 0 评论 -
Vue.js中的表单域修饰符的用法
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>常用特性</title.原创 2021-05-19 23:14:49 · 154 阅读 · 0 评论 -
Vue.js表单修饰符
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>常用特性</title.原创 2021-05-19 22:57:59 · 83 阅读 · 0 评论 -
Vue.js对表单的操作
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>常用特性</title.原创 2021-05-19 22:56:34 · 146 阅读 · 0 评论 -
class的绑定
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Vue的基本使用</t.原创 2021-05-06 21:59:01 · 300 阅读 · 0 评论 -
浅谈v-model
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Vue的基本使用</t.原创 2021-05-06 21:58:15 · 181 阅读 · 0 评论 -
Vue中按钮修饰符
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>按钮修饰符</title> </head> <body> <script src="js/vue.js" charset="UTF-8"></script> <div id="box"> <form action="#" m.原创 2021-05-04 17:28:50 · 210 阅读 · 0 评论 -
V-cloak指令
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>V-cloak指令</title> <script src="js/vue.js"></script> <style type='text/css'> [v-cloak] display:none; </style> </head&g.原创 2021-05-04 17:22:35 · 174 阅读 · 0 评论 -
Vue前端模板引擎
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>前端模板引擎</title> <script src="js/vue.js"></script> </head> <body> <script id='tpl' type="text/javascript"> {{if obj}}.原创 2021-04-27 21:07:52 · 401 阅读 · 0 评论 -
Vue插值表达式
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>插值表达式</title> <script src="js/vue.js"></script> </head> <body> <!---{{}} 插值表达式 --> <div id='box'>{{msg}} <.原创 2021-04-27 21:06:34 · 143 阅读 · 0 评论