vue全局注册自定义图片属性

vue全局注册自定义图片属性,第1张

在一个项目中,可能有很多的图片加载失败,就需要将图片设计成一个组件 ,在main.js里面设计


这个是在main.js里面全局设计的 自定义事件 el是绑定的标签 onerror是这个自定义绑定事件的接口 ,当出现错误的时候 就会走这个函数


这是自定义事件添加img标签里面的属性, 当src里面是staffphoto出现错误的时候 ,自定义事件;里面的函数执行 将defaultimg这个变量代表的值 重新赋值给src 这样 就不会出现碎图

**

注意:

**
defaultimg 是一个新的变量 ,需要在data里面添加

如果这样写 ,会出现一个问题 这是个字符串 img标签无法识别字符砖传和@符号
结果就是这样:

src标签里面出现 @ 符号 这样不好

这时候 就想到一个办法,将svg图片作为一个组件 引入 同时将路径赋值给这个默认的变量

线面data里面用的是 es6的语法 简单赋值

**

模块化的按需导出自定义事件

**
如果把自定义事件 都放在main.js里面就不是很好,因为里面可能会加入很多其他东西
解决办法就是: 创建一个新的文件夹 将自定义事件放在里面

1–这是main.ls里面的自定义属性

2----创建一个新的文件夹


但是这也不是最优的结局方案 一般情况下 都是生名 一个变量 将自定义的方法接收

同时 ,将方法按需导出 引入到main.js里面


上面按需引入的 方法是在对象里面 ,直接给这个对象声明一个变量接收

3----引入以后,需要将 对象 里面的东西 挂载到vue

directives[k] 其实就是
{ inserted (el ,binding) {函数体代码}}

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1324880.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-12
下一篇 2022-06-12

发表评论

登录后才能评论

评论列表(0条)

保存