前端开发

Vue模板语法指令动态参数

指令 (Directives) 是带有 v- 前缀的特殊 attribute。指令 attribute 的值预期是单个 JavaScript 表达式,指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。回顾我们在介绍中看到的例子:

Vue模板语法指令参数

指令 (Directives) 是带有 v- 前缀的特殊 attribute。指令 attribute 的值预期是单个 JavaScript 表达式 (v-for 是例外情况,稍后我们再讨论)。指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。

Vue模板语法插值,使用 JavaScript 表达式

迄今为止,在我们的模板中,我们一直都只绑定简单的 property 键值。但实际上,对于所有的数据绑定,Vue.js 都提供了完全的 JavaScript 表达式支持。

Vue模板语法插值Attribute(v-bind指令)HTML标签属性(attribute)的值

Mustache 语法不能作用在 HTML attribute 上,遇到这种情况应该使用 v-bind 指令:

Vue模板语法插值原始HTML(v-html指令)Mustache语法

双大括号会将数据解释为普通文本,而非 HTML 代码。为了输出真正的 HTML,你需要使用 v-html 指令:

Vue模板语法插值文本插值(Mustache语法、双大括号包裹属性变量)

Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML,所以能被遵循规范的浏览器和 HTML 解析器解析。

Vue 实例,实例生命周期钩子

每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会。比如 created 钩子可以用来在一个实例被创建之后执行代码:

Vue 实例,创建一个 Vue 实例,数据与方法(data对象数据属性)

Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。

通过vue-ui 打开一个可视化界面,来管理项目

学习Vue过程中用到一种构建vue项目的方法:通过vue-ui打开一个可视化界面来管理项目,新建一个文件夹,在文件夹下敲命令 vue-ui,就能打开本地ip,端口8000,就可以看到一个可视化界面,操作界面create项目,基本和使用脚手架vue-cli创建项目一样,只是这里看起来更明了。

高德地图 Web Api、Js 接口 UI 组件 - PoiPicker 获取店铺信息以及经纬度

高德地图 UI组件-PoiPicker,高德地图 Web Api、Js 接口 UI 组件 - PoiPicker 获取店铺信息以及经纬度。高德地图API/SDK是一套为开发者提供的地图应用程序接口,包括JavaScript、iOS、Andriod、Windows、静态地图、Web服务等多种版本。提供了定位、地图、导航(公交驾车步行)、位置搜索、周边检索、地理编码及逆地理编码、实时路况等丰富功能。