vue
wangsiyisiyi
这个作者很懒,什么都没留下…
展开
-
手写一个基础的VueRouter构造函数
let _vue = nullexport default class VueRouter { static install (Vue) { // 判断当前插件是否已经安装 if (VueRouter.install.installed) { return } VueRouter.install.installed = true // vue记录到全局变量 _vue = Vue // 创建vue实例时,把传入的routes对象注入到v原创 2021-05-26 12:33:50 · 282 阅读 · 0 评论 -
vue中设置全屏和退出全屏,esc和f11的按键事件的特殊处理
//mounted中 //本来想直接禁掉esc的键盘按下的默认行为的,但是浏览器会有个提示,并且百度看了众多解决方案,这个提示貌似不好去掉 // if (navigator.keyboard && navigator.keyboard.lock) { // // 禁用esc退出全屏 // navigator.keyboard.lock(['Escape']) // } else { // console.log('您的浏览器上不支持该功能原创 2021-05-20 18:12:47 · 4949 阅读 · 7 评论 -
利用vue-cli快速创建vue项目的基础步骤
安装vue-cli进入终端,输入下面指令 npm i -g @vue/cli //下载并安装指令 vue -V //查看是否下载成功,如果成功,会显示当前下载的版本号创建项目vue create . //就以当前文件夹的名字为项目名称 或者下面这个指令创建vue create 项目名称 //项目名称不能为中文选择创建的一些要求,使用上下键切换和空格键/回车...原创 2020-03-27 23:21:07 · 174 阅读 · 0 评论 -
vue实例和vue组件的生命周期以及生命周期钩子函数
beforeCreate函数,实例初始化之前就会触发,这个函数没什么用,因为它什么也没拿到created函数,实例初始化完了,会触发,这时候,可以拿到实例里面的data了,如果在这个函数内部,更改数据,不会触发updated和beforeUpdate函数beforeMounte函数,虚拟dom生成之前触发,也可以拿到实例里面的数据mounted函数,虚拟dom完成,并挂载好了,可以拿到页面...原创 2020-03-25 23:06:22 · 197 阅读 · 0 评论 -
组件之间通信
利用props实现父组件给子组件传递数据,就是子组件可以使用到父组件的数据<body> <div id="box"> <father></father> </div> <template id="father"> <div> &l...原创 2020-03-24 23:02:58 · 201 阅读 · 0 评论 -
vue的监听器和计算属性
本篇主要介绍vue的wtach属性和computed属性的一个简单使用场景.实现需求,设置一个数,通过单击对应按钮,我们可以让这个数按规律变化(比如自增),同时页面是可以实时得到根据这个数变化而变化的一些值(比如,这个数的两倍).下面提供了三种解决方法.一、利用函数解决,这个方法有个弊端,changeTwo方法中实际使用的数据就是num,但是当data中其余的数据产生变化的时候,依旧会触发ch...原创 2020-03-21 23:13:32 · 144 阅读 · 0 评论 -
vue中的v-for指令
通过v-for,循环把数据渲染到页面上,也可以通过它创建多个类似的元素.应用举例:<body> <div class="box"> <ul> <li v-for='item in arr'>{{item}}</li>//遍历arr数组,item就是遍历时,拿到的每一个元素 ...原创 2020-03-20 23:35:22 · 209 阅读 · 0 评论 -
利用vue的v-bind指令给元素设置id,class和style
利用v-bind添加一个类名<head> <style> .a{ color:yellow; } </style></head><body> <p v-bind:class="'a'">111111111111</p>//给p标签添加名为a的类 //v-bind可以省略 <p :...原创 2020-03-19 23:18:02 · 1565 阅读 · 0 评论 -
vue网址和特点,mvvm模型简单介绍
vue的官网地址 https://cn.vuejs.org/vue的特点:易用,灵活,和高效,我们利用vue管理数据,简化操作,可以丢掉复杂的dom操作.vue的模型是mvvm,分成三部分,m(model)数据模型层,v(view)视图层,还有(vm)viewmodel层,其中vm和m之间是双向绑定,m将数据传递给vm,v层直接取走渲染到页面,用户在v层操作,让vm通知m层更新数据,重新传递...原创 2020-03-18 23:18:36 · 556 阅读 · 0 评论