vue的学习
文章平均质量分 92
你真好看l
。。
展开
-
vue组件通信六种方式
https://segmentfault.com/a/1190000019208626原创 2020-06-11 18:38:36 · 160 阅读 · 0 评论 -
在腾讯云服务器上部署项目
腾讯云服务器有十多天的免费试用期,可以拿这个来学习本地项目部署到服务器。供外网访问自己的项目。1.申请服务器进入服务器列表点击更多进行密码重置点击登陆输入用户名密码登陆就进入linux操作系统命令行界面了2.nginx安装参考菜鸟教程https://www.runoob.com/linux/nginx-install-setup.html先安装PCRE,PCRE 作用是让 Nginx 支持 Rewrite 功能。1.下载 PCRE 安装包[root@bogon src]# cd /原创 2020-05-17 22:06:38 · 48 阅读 · 1 评论 -
前后端项目部署方案
1.前后端一起部署(前端打包成静态文件后,拷贝到后端项目中。然后部署后端项目)2.前后端分离部署,前端使用后nginx部署,后端直接运行.jar原创 2020-05-08 22:20:31 · 5351 阅读 · 0 评论 -
vue-cli3创建项目
安装vue-cli3npm install -g @vue/cli创建项目vue create demo运行项目npm run serve项目结构:原创 2020-04-18 12:14:40 · 86 阅读 · 0 评论 -
vue-cli2编写项目
项目创建vue init webpack vue_demo //下载模版cd vue_demonpm install项目结构原创 2020-04-18 12:11:15 · 94 阅读 · 0 评论 -
创建vue-cli项目
使用vue-cli创建模板项目:1说明:1) vue-cli是vue官方提供的脚手架工具2) github:https://github.com/vuejs/vue-cli3) 作用: 从https://github.com/vuejs.templates下载模板项目安装vue-cli:第一步应该下载node.js这是安装vue-cli的基础工具。官网下载快捷安全可:https://n...原创 2019-10-19 00:35:37 · 75 阅读 · 0 评论 -
自定义指令
除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令。注意,在 Vue2.0 中,代码复用和抽象的主要形式是组件。然而,有的情况下,你仍然需要对普通 DOM 元素进行底层操作,这时候就会用到自定义指令。<!DOCTYPE html><html> <head> <meta charset="utf-8"&...原创 2019-10-19 00:31:48 · 235 阅读 · 0 评论 -
指令
常用内置指令:v:text:更新元素的textContentv:html:更新元素的innerHTMLv-if:如果为true当前标签才会执行v-else:如果为false当前标签才会输出到页面v-show:通过控制display样式来控制显示/隐藏v-for:遍历数组/对象v-on:绑定事件监听,一般写为@v-bind:强制绑定解析表达式,可以省略v-bindv-model:双...原创 2019-10-18 22:37:37 · 132 阅读 · 0 评论 -
过滤器
Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号指示。<!DOCTYPE html><html> <head> <meta charset="utf-8">...原创 2019-10-17 11:04:41 · 108 阅读 · 0 评论 -
css动画
CSS 动画用法同 CSS 过渡,区别是在动画中 v-enter 类名在节点插入 DOM 后不会立即删除,而是在 animationend 事件触发时删除。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>动画(animation)</title>...原创 2019-10-17 11:01:27 · 134 阅读 · 0 评论 -
css过渡
过渡的类名在进入/离开的过渡中,会有 6 个 class 切换。v-enter:定义进入过渡的开始状态。在元素被插入之前生效,在元素被插入之后的下一帧移除。v-enter-active:定义进入过渡生效时的状态。在整个进入过渡的阶段中应用,在元素被插入之前生效,在过渡/动画完成之后移除。这个类可以被用来定义进入过渡的过程时间,延迟和曲线函数。v-enter-to: 2.1.8版及以上 定义...原创 2019-10-17 10:59:09 · 232 阅读 · 0 评论 -
vue生命周期
1vue对象生命周期1)初始化显示* beforeCreate()* created()* beforeMount()* mounted()2)更新显示:this.xxx=value* beforeUpdate()* updated()3)销毁vue实例:vm.$destroy()*beforeDestroy()*destroyed()2.常用的生命周期方法created...原创 2019-10-17 10:46:16 · 96 阅读 · 0 评论 -
表单数据绑定
v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件:text 和 textarea 元素使用 value 属性和 input 事件;checkbox 和 radio...原创 2019-10-17 10:38:51 · 379 阅读 · 0 评论 -
事件处理
监听事件:可以用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码.然而许多事件处理逻辑会更为复杂,所以直接把 JavaScript 代码写在 v-on 指令中是不可行的。因此 v-on 还可以接收一个需要调用的方法名称。除了直接绑定到一个方法,也可以在内联 JavaScript 语句中调用方法。事件修饰符:在事件处理程序中调用 event.prevent...原创 2019-10-17 10:11:24 · 74 阅读 · 0 评论 -
列表搜索和排序
有时,我们想要显示一个数组经过过滤或排序后的版本,而不实际改变或重置原始数据。在这种情况下,可以创建一个计算属性,来返回过滤或排序后的数组。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>列表渲染-搜索和排序</title> <!--...原创 2019-10-16 22:41:54 · 323 阅读 · 0 评论 -
列表渲染
我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法,其中 items 是源数据数组,而 item 则是被迭代的数组元素的别名。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>v-fo...原创 2019-10-16 22:14:40 · 345 阅读 · 0 评论 -
条件渲染
1.条件渲染指令:v-if ( 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。) v-else(元素必须紧跟在带 v-if 或者 v-else-if 的元素的后面,否则它将不会被识别。)v-show2.比较v-if与v-show 如果需要频繁切换v-show更好v-if的隐藏是将标签移除 v-show是将样式隐藏,元素始终会被渲...原创 2019-10-16 21:50:42 · 309 阅读 · 0 评论 -
class与style绑定
操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是属性,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。1.理解 在应用界面中, 某个(些)元素的样式是变化的 ...原创 2019-10-16 21:41:19 · 164 阅读 · 0 评论 -
侦听器
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="vue.js" type="text/javascript" charset="utf-8"></script> <...原创 2019-10-16 21:23:55 · 202 阅读 · 0 评论 -
计算属性和监视
模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。所以,对于任何复杂逻辑,你都应当使用计算属性。1.计算属性 在computed属性对象中定义计算属性的方法 在页面总使用{{方法名}}来显示计算的结果。2.监视属性 通过vm对象的$watch()或watch配置来监视指定的属性 当属性变化时,回调函数自动调用,在函数内部进行计算...原创 2019-10-16 21:17:56 · 374 阅读 · 0 评论 -
模板语法
Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够智能地计算出最少需要重新渲染多少组件,并把 DOM 操作次数减到最少。1.模板的理解: 动态的htm...原创 2019-10-16 20:39:59 · 311 阅读 · 0 评论 -
vue的基本使用
vue的基本认识:vue 渐进式框架 可自底向上逐层应用作用:动态构建用户界面特点:遵循mvvm模式编码简洁,体积小,效率高,适合移动和pc端开发vue核心库只关注视图层,便于与第三方库或既有项目整合<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>...原创 2019-10-16 17:48:12 · 158 阅读 · 0 评论