2020年2月17日

vue基础(3)样式绑定

摘要: 理论知识 样式也属于标签的一种,因此样式绑定同属性绑定的思路一致,只是语法上有些不同。 样式绑定两种方式 对象语法 v bind:class='{key1:value1; key2:value2;.... }',calss中设置的是键值对,key表示给该标签的类名,用在style中使用类选择器选择; 阅读全文

posted @ 2020-02-17 16:38 tylerGuo 阅读(232) 评论(0) 推荐(0) 编辑

2020年2月15日

vue指令(8)v-bind

摘要: 理论知识 v bind是用来绑定属性,即绑定html标签的属性值,使其可以动态变化。注意操作目标是标签的属性,在左尖括号内部。 这不同于v model,v model是绑定的标签的value值,即用户输入或者可能看到的值,主要在两个尖括号之间。v bind在内部控制标签的行为,对用户透明。 使用方式 阅读全文

posted @ 2020-02-15 21:47 tylerGuo 阅读(124) 评论(0) 推荐(0) 编辑

form表单button按钮,未成功跳转,自动刷新页面。

摘要: 问题描述 在学习vue表单时,表单的提交按钮使用的是一个button标签,同时button也绑定了另外一个方法。该方法在浏览器的console中打印内容。在执行时,打印的内容一闪而过,表单页面也发生了刷新。 理论原因 在ie中,button的默认type为button,而在其他浏览器中是submit 阅读全文

posted @ 2020-02-15 20:34 tylerGuo 阅读(393) 评论(0) 推荐(0) 编辑

2020年2月13日

vue指令(7)v-on

摘要: 理论知识 双向数据绑定中,数据有多个来源,包括后台业务数据,用户网页操作数据等。对于用户网页操作,vue提供了事件机制,对用户操作做出反应。 使用方式 v on:标准事件='事件处理逻辑'。 标准实践包括点击(click)、焦点(focus)等。在标签中使用时有四种方式,以点击事件为例 按钮 //直 阅读全文

posted @ 2020-02-13 22:29 tylerGuo 阅读(189) 评论(0) 推荐(0) 编辑

2020年2月12日

vue指令(6)v-model

摘要: 理论知识 双向数据绑定 数据绑定指数据和变量关联,两者内容一致。 双向即两个方向。 方向一 通过插值表达式,html标签绑定中vue实例对象的data属性中的变量,即获取变量并显示,此时时模型的值向网页输出。 方向二 通过v model指令,将能够获取用户操作值的网页标签同vue实例对象的data属 阅读全文

posted @ 2020-02-12 21:21 tylerGuo 阅读(255) 评论(0) 推荐(0) 编辑

vue指令(5)v-once

摘要: 理论知识 数据响应式 所谓响应是指对每一次变化,都做出相应的动作变化。那么数据响应式是指当赋值给变量的数据发生变化时,代码中使用该变量的位置也发生数据更新。即数据动态变化。 数据绑定 vue通过自定义指令,将数据和网页标签关联起来。 基于数据绑定和数据响应式,vue实现了将变化的数据动态的写入变量, 阅读全文

posted @ 2020-02-12 20:53 tylerGuo 阅读(295) 评论(0) 推荐(0) 编辑

vue指令(4)v-pre

摘要: 理论知识 v pre用来跳过编译过程,页面中显示原始的变量名称。类似java中的转义字符。 实践 总结 指令的本质是vue作者自定义的网页标签属性。因此他的位置是在标签的左尖括号内部。 阅读全文

posted @ 2020-02-12 20:27 tylerGuo 阅读(340) 评论(0) 推荐(0) 编辑

vue指令(3)v-html

摘要: 理论知识 v html可向元素中插入html片段,例如 '标题一'等 该指令存在安全漏洞,因此在本地代码中可以使用,如果要调用第三方的代码中包含该指令,则存在安全隐患。 该指令的值可以同vue对象的data属性中变量绑定。 实践 总结 指令的本质是vue作者自定义的网页标签属性。因此他的位置是在标签 阅读全文

posted @ 2020-02-12 20:21 tylerGuo 阅读(1664) 评论(0) 推荐(0) 编辑

vue指令(2)v-text

摘要: 理论知识 v text指令向标签中输入字符串,但不存在闪动问题,等价与 v cloak+插值表达爱式。 v text可以取到data中的数据。 实践 总结 指令的本质是vue作者自定义的网页标签属性。因此他的位置是在标签的左尖括号内部。 阅读全文

posted @ 2020-02-12 16:22 tylerGuo 阅读(212) 评论(0) 推荐(0) 编辑

vue基础(2)模板语法

摘要: 理论知识 前端渲染 定义 将数据填充到HTML标签中,这是个处理过程。首先准备数据、模板,然后经过前端渲染处理,生成静态的HTML内容。 实现方式 1、原生js拼接字符串 但不同人的写法不同,后期维护困难。 2、前端模板引擎(beetl) 克服了方式一的缺点,但没有事件机制。 3、vue特有的模板语 阅读全文

posted @ 2020-02-12 16:18 tylerGuo 阅读(185) 评论(0) 推荐(0) 编辑

导航