![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue入门
文章平均质量分 54
进阶的前端工作者
这个作者很懒,什么都没留下…
展开
-
vue双向绑定原理
目前数据监听到此为止了,下面我们肯定需要把更改的数据让页面同时也需要跟着更改,但是需要考虑的是 我们不能数据变一次,页面就跟着改一次,这样太消耗性能了。此时已经可以在页面中显示了(当然是需要调用 ),大家可以看到页面已经没有{{}}了,这里提醒下大家好好学习下正则,递归,es6。此时就有个问题了,这样我们只能访问到第一层,此时用个递归就可解决。4、我们下面创建一个数据解析的函数 compile。下面,我们就需要添加大家常听到的发布者,订阅者了。2、双向绑定,我们当然需要监听data中的数据。原创 2022-10-30 17:33:04 · 396 阅读 · 1 评论 -
electron+vue开发录屏小工具
环境:node脚手架:vue-cli4 electron-builder开发工具:vscode目录结构:background.js'use strict'// import { app, protocol, BrowserWindow} from 'electron'import { dialog, app, BrowserWindow, protocol, ipcMain, globalShortcut, Notification, shell, screen } from "ele原创 2021-03-29 19:46:28 · 816 阅读 · 2 评论 -
简单实现MVVM
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>自定义MVVM</title></head><body> <div id="ap原创 2020-06-30 10:08:57 · 158 阅读 · 0 评论 -
vue模块化项目的搭建
vue项目的环境搭建首先要进行环境依赖检测然后就是vue的脚手架的安装-基于node,必须得要安装npm install @vue/cli -g现在脚手架工具就安装成功了,在命令行输入vue就可以看到帮助接下来,我们来构建项目,在命令行输入vue create my-mall我这边选的是自定义的按回车进入子配置我这这输入N,选择了hash模式然后回车选择了les...原创 2020-02-11 15:06:42 · 541 阅读 · 0 评论 -
用vue实现元素的拖拽功能
用vue实现元素的拖拽功能去这边实现拖拽功能用到的是vue中自定义指令的方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s...原创 2020-01-07 17:02:28 · 5783 阅读 · 0 评论 -
Vue入门讲解day06-过滤器(filters)
过滤器(filters)用过滤器的功能实现简单的评分,代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1...原创 2020-01-02 14:43:28 · 108 阅读 · 1 评论 -
vue入门讲解day05
响应式原理vue的响应式原理:Object.defineProperty()(数据劫持) <script> let defaultV = 'tom'; let obj = {}; Object.defineProperty(obj,'name',{ get(){ cons...原创 2019-12-28 12:11:41 · 77 阅读 · 0 评论 -
vue入门day04
vue的元素控制指令v-show、v-if<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &...原创 2019-12-27 14:44:30 · 86 阅读 · 0 评论 -
vue入门讲解 day03
事件修饰符按键修饰符可以使用按键码和按键的别名q,w,e,r…enter tab delete(捕获删除或者退格键) esc space up down left rightctrl alt shift metajs中的按键事件 : keyup ,在不加修饰符的情况下,不管按哪个键都会触发,如下:<!DOCTYPE html><html lang="...原创 2019-12-25 10:51:56 · 107 阅读 · 0 评论 -
vue入门讲解 day02
事件绑定指令一、书写<标签 v-on:事件=“事件名”></标签><标签 @事件=“事件名”></标签>//@可以代替v-on:二、说到事件绑定,就不得不说一下vue中的方法仓库methods,如下,在vue实例中:methods:{ // 定义方法,方法仓库 show:function(){ ...原创 2019-12-23 14:24:14 · 103 阅读 · 0 评论 -
vue入门讲解 day01
一、设计模式1、SPA Single Page Application 单页应用程序就是只有一个web页面的应用,所有的操作都在这个页面上完成(容器页面)浏览器一开始会加载相应的HTML、CSS和JavaScript,然后将所有的活动都局限在该Web页面中当用户与应用程序交互时通过JavaScript动态更新页面中的内容2、MVVM Model-View-ViewMod...原创 2019-12-20 15:16:52 · 124 阅读 · 0 评论