Web框架/Vue/
Blockchain Explorer
雄关漫道真如铁,而今迈步从头越。
真想做,总有办法;
不想做,总有理由。
展开
-
前端UI框架——Vue概述和快速入门案例
说明:若是想直接开发,可跳过此篇博客。一、官网资料英文官网 中文官网二、Vue 介绍1、基本介绍【官网介绍】 Vue 是一套用于构建用户界面的渐进式JavaScript 框架。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用提供驱动。2、作用 ...原创 2018-08-28 20:52:32 · 703 阅读 · 0 评论 -
前端UI框架——VueAPI使用之自定义指令
一、基本介绍1、全局自定义指令// 注册一个全局自定义指令 `v-focus`Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() }})2、局部指令 如果想注册局部指令,组件中也接受一个 directives 的选项:...原创 2018-08-28 22:32:19 · 329 阅读 · 0 评论 -
前端UI框架——VueAPI使用之内置指令
一、基本介绍 常用内置指令: 指令 描述 v-text 更新元素的 textContent v-html 更新元素的 innerHTML v-if 如果为true, 当前标签才会输出到页面 v-else 如果为false, 当前标签才会输出到页面 v-show 通过控制display样式来控制显示/隐藏 v-f...原创 2018-08-28 22:25:47 · 560 阅读 · 0 评论 -
前端UI框架——VueAPI使用之过滤器
一、基本介绍 1、理解过滤器 1) 功能: 对要显示的数据进行特定格式化后再显示 2) 注意: 并没有改变原本的数据, 可是产生新的对应的数据 2、定义和使用过滤器 1) 定义过滤器 Vue.filter(filterName, function(value[,arg1,arg2,...]){ // 进行一定的数据处理 return newValu...原创 2018-08-28 22:20:38 · 367 阅读 · 0 评论 -
前端UI框架——VueAPI使用之表单输入绑定
一、基本介绍使用v-model对表单数据自动收集 text/textarea checkbox radio select二、代码示例:代码案例:<!DOCTYPE html><html lang="en"><head> <meta charset原创 2018-08-28 22:17:14 · 358 阅读 · 0 评论 -
前端UI框架——VueAPI使用之流程控制
一、基本介绍v-if v-else v-else-if v-show v-for二、代码示例:1、v-if 代码案例:<body> <div id="app"> <p v-if="ok">v-if</p>原创 2018-08-28 21:33:55 · 1020 阅读 · 0 评论 -
前端UI框架——VueAPI使用之Class 与 Style 绑定
一、基本介绍1、绑定 HTML Class 字符串语法 对象语法 数组语法 2、绑定内联样式——Style 对象语法二、代码示例:1、class(字符串)代码案例:<!DOCTYPE html><html lang="en"><head>原创 2018-08-28 21:26:14 · 644 阅读 · 0 评论 -
前端UI框架——VueAPI使用之计算属性和侦听器(监听器)
一、基本介绍计算属性和侦听器 1、基础使用 2、计算属性缓存 3、计算属性的 getter/setter 4、监听属性watch $watch二、代码案例1、基础使用代码实例:<!--计算属性和侦听器1、基础使用2、计算属性缓存3、计算属性的 getter/setter4、监听属性watch $watch--><body>&lt...原创 2018-08-28 21:17:56 · 574 阅读 · 0 评论 -
前端UI框架——VueAPI使用之事件处理
一、基本介绍事件处理: 1、事件监听 v-on:click/@click 2、事件处理方法 3、事件修饰符 .prevent : 阻止事件的默认行为 event.preventDefault() .stop : 停止事件冒泡 event.stopPropagation()4、按键修饰符 .keycode : 操...原创 2018-08-28 21:07:50 · 363 阅读 · 0 评论 -
前端UI框架——VueAPI使用之数据绑定
一、基本介绍数据绑定: 1、 {{}} :v-text v-html 2、数据双向绑定v-model 3、数据的转绑 vm.msg 4、数据的强制绑定:v-bind:src / @src二、代码案例<!DOCTYPE html><html lang="en"><head> <meta原创 2018-08-28 21:01:28 · 1211 阅读 · 0 评论 -
webpack使用(4)之引入第三方JS库
一、script引入第三方库lodash 不建议使用<script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>原创 2018-09-09 19:41:00 · 2593 阅读 · 0 评论