【Vue.js 入门与实战】--指令-定义私有指令

简介: 自定义私有指令

指令-定义私有指令

 

一、自定义私有指令

Directives: {

‘fontweight’:{

bind:tunction(el,binding) {//binding的位置是形参,所以名称是什么无所谓,bindings等也可以,只要和下面同步即可。

<div id=”app2”>    

<h3 v-color=”pink”>{{dt|dateformat}}</h3>

<div>

演示结果:字体颜色变为粉色

image.png

 

Directives:{//自定义私有指令

这里也有两个条件需要定义:指令名称和指令对象

Fontweight:{

binding.function(el,binding{

el.style.fontweight=binding.value

调用指令:

<h3 v-color="'pink'"v-fontweight=”900"> {{dt|dateformat}} </h3>

演示效果如下图:文字加粗

image.png

所以我们可以得出结论,全局指令和私有指令的定义方式类似。

相关文章
|
12天前
|
数据可视化 JavaScript 架构师
D3.js实战:数据可视化高级技巧实例应用
本文介绍了D3.js入门,包括创建HTML文件引入库、绘制简单线图、柱状图和饼图。示例展示了数据绑定、交互性和动画效果,如柱状图的悬停效果和线图的数据平滑过渡。此外,还提及力导向图和地图可视化的实现,以及使用Enter, Update, Exit模式进行动态更新。最后提到了复杂图表和高级技巧,如使用组件库、动画、交互性和性能优化。
28 0
|
4天前
|
JavaScript 程序员 网络架构
vue路由从入门到进阶 --- 声明式导航详细教程
vue路由从入门到进阶 --- 声明式导航详细教程
vue路由从入门到进阶 --- 声明式导航详细教程
|
7天前
|
JavaScript 前端开发 C++
【Vue】Vue快速入门、Vue常用指令、Vue的生命周期
【Vue】Vue快速入门、Vue常用指令、Vue的生命周期
13 2
|
11天前
|
JavaScript
学习Node.js入门范例
然后,cmd中运行命令node E:/Test/server.js
15 2
|
12天前
|
IDE JavaScript 开发工具
Auto.js 开发入门
Auto.js 开发入门
|
13天前
|
JavaScript 前端开发
Symbol在JavaScript中还有哪些内置的Symbol可以用于定义特定的方法或属性
Symbol在JavaScript中还有哪些内置的Symbol可以用于定义特定的方法或属性
|
17天前
|
JSON JavaScript 前端开发
web前端入门到实战:32道常见的js面试题,2024年最新秋招是直接面试吗
web前端入门到实战:32道常见的js面试题,2024年最新秋招是直接面试吗
|
17天前
|
JavaScript 前端开发 程序员
web前端入门到实战:32道常见的js面试题(1),面试哪些
web前端入门到实战:32道常见的js面试题(1),面试哪些
|
17天前
|
JavaScript 开发工具 git
Vue 入门系列:.env 环境变量
Vue 入门系列:.env 环境变量
25 1
|
18天前
|
JavaScript 前端开发 程序员
javascript基础(入门),当上项目经理才知道,推荐程序员面试秘籍
javascript基础(入门),当上项目经理才知道,推荐程序员面试秘籍