![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
vue
laluneX
这个作者很懒,什么都没留下…
展开
-
Vue的学习Ⅻ(vue3的一些特性、mpvue )
一、Composition API它是为了实现基于函数的逻辑复用机制而产生的reactiveimport { createApp, h, reactive } from 'vue';const App = { render() { // render函数类似于template: `<div><span>李老板</span></div>` return h( 'div', { //原创 2020-05-15 15:35:20 · 336 阅读 · 0 评论 -
Vue的学习Ⅺ(响应式原理)
想要搞定响应式原理必须搞定两个问题:1、当Vue里面的data数据改变时,Vue内部是如何监听数据的改变?Object.defineProperty里的set与get方法 -> 监听对象属性的改变let obj = { // 定义的obj对象 name: '涂涂', age: 18, gender: 'male'};Object.keys(obj).forEach(key => { // 遍历得到obj对象的每个key let value = ob原创 2020-05-13 10:37:03 · 123 阅读 · 0 评论 -
Vue的学习Ⅹ(mixin与extend、fastclick、图片懒加载、单位转换插件)
一、mixin与extendmixinlet mixin = { // 定义一个mixin data() { // 混入mixin,也可以混入methods、components等等 return { name: '' } }, created: function () { console.log(1) }}let vm = new Vue({ created: function () { console.log(2) }, mixins:原创 2020-05-11 20:26:58 · 288 阅读 · 0 评论 -
Vue的学习Ⅸ(事件总线)
一、应用场景二、具体使用/*main.js文件*/Vue.prototype.$bus = new Vue(); /*在原型上面添加Vue实例*//*组件2*/<template> <div> <img src = "~assets/img/introduce.png" alt = "" @load="imgLoad"> &...原创 2020-05-07 11:57:57 · 163 阅读 · 0 评论 -
Vue的学习Ⅷ(项目的目录结构)
使用vue cli4搭建项目的目录结构: ├─myvue │ ├─build // 保存一些webpack的初始化配置,项目构建 │ │ ├─build.js // 生产环境构建 │ │ ├─check-version.js // 检查npm、node版本 │ │ ├─vue-loader.conf.js // webpack...原创 2020-04-29 14:03:32 · 151 阅读 · 0 评论 -
Vue的学习Ⅶ(路径别名、vuex、数据响应)
一、配置vue-cli 3中vue.config.js的路径别名点击这里查看posted @ 2019-11-14 09:25 龙象般若功https://www.cnblogs.com/jlfw/p/11854828.html不过要注意的是路径别名如果是在import处使用可以直接用,而在html标签里面 必须在路径前面使用~如:/*html里面必须使用~*/<img slo...原创 2020-04-27 21:04:25 · 240 阅读 · 0 评论 -
Vue学习Ⅵ(路由)
一、vue clicli是什么意思呢?CLI是Command-line Interface(命令行界面),俗称脚手架Vue Cli是一个官方发布的Vue.js项目脚手架使用vue-cli可以快速搭建Vue开发环境和对应的webpack配置,但如果只是写几个小demo,就不需要Vue-Cli二、三、四、五、本文只用于个人学习与记录...原创 2020-04-24 21:09:27 · 335 阅读 · 0 评论 -
Vue Cli2和3的安装与介绍Ⅴ
一、vue-clicli是什么意思呢?CLI是Command-line Interface(命令行界面),俗称脚手架Vue Cli是一个官方发布的Vue.js项目脚手架使用vue-cli可以快速搭建Vue开发环境和对应的webpack配置,但如果只是写几个小demo,就不需要Vue-Cli/*脚手架3*/cnpm install @vue/cli -g二、拉取 2.x 模板 (旧版...原创 2020-04-21 20:41:44 · 659 阅读 · 0 评论 -
Vue学习Ⅳ(slot与v-slot、模块化开发、导入与导出、webpack)
一、二、原创 2020-04-21 14:14:29 · 548 阅读 · 0 评论 -
Vue学习Ⅲ(过滤器、v-model、组件化说明与数据传输、父子组件相互之间的通信、$children和$refs、$parent与$root)
一、vue的过滤器查看官网二、表单双向绑定v-modelv-model的基本使用Vue是使用v-model指令来实现表单元素与数据的双向绑定v-model的基本使用与双向绑定那么什么是双向绑定呢?表单的双向绑定就是当表单里面的值改变的时候对应的数据也会改变,当数据改变的时候表单里面的值也会实现同步改变,而使用mustache语法只会实现单向绑定举个栗子:<div class...原创 2020-04-19 12:49:59 · 389 阅读 · 0 评论 -
Vue的学习Ⅱ(v-on、v-if、v-else-if、v-else、v-show、v-for)
一、v-on基本使用 <div class = "app"> <h2>{{num}}</h2> <button v-on:click="increment">+</button> /*v-on事件绑定*/ <button @click="decrement">-</butto...原创 2020-04-17 09:25:36 · 1777 阅读 · 0 评论 -
Vue的学习Ⅰ(mustache、一些指令、v-bind、计算属性、methods)
一、插值操作与一些指令{{}}:mustache语法mustache + v-once<div class = "app"> <h3>{{message}},{{name}}</h3> <h3 v-once>{{message}},{{name}}</h3> /*v-once目的是当外部传入数据改变的时候不让h3...原创 2020-04-15 13:31:14 · 247 阅读 · 0 评论 -
Vue的简单认识与说明
一、国内使用较多,国人开发的一个框架想了解的点击这里这里二、Vue是一个渐进式、响应式的框架那什么是渐进式框架呢?渐进式意味着我们可以使用Vue来作为我们应用的一部分嵌入到项目内,也就是说可以使用Vue来一点一点的嵌入到项目内,而达到渐进。那什么是响应式框架呢?当一个状态改变之后,与这个状态相关的事务也立即随之改变,从前端来看就是数据状态改变后相关 DOM 也随之改变。数据模型仅仅是普...原创 2020-04-14 12:37:38 · 225 阅读 · 0 评论