原生监听事件和内置事件的处理以及穿件Vue3的自定义模板

1和内置事件的处理和内置事件的处理

1.和内置事件的处理

在我们的vue的里面有着非常多的事件,有一些组件也有着自己的事件。

我们可以去一些官方网站去了解一些事件:事件处理 | Vue.js (vuejs.org)

组件事件比如我们的scroll-view组件

每一个事件都对于不同的效果有着不同的处理方式或者会发生不同的效果。

比如我们的点击事件 onClick 这个可以在我们点击某个组件的时候起到作用,从而改变我们的页面显示效果等。

我们可以改变的不止有变量也可以改变我们的背景颜色,我们的背景颜色一般是有 "#"+6个数字,我们可以使用Math.random()随机数因为我们的随机数的范围是0~1的小数所以截取我们随机数的小数点后的位置是3~9个数字来作为我们的背景颜色的数字,在截取之前将其变为string 类型。

2.内置事件的处理

我们在页面操作的时候会发现我们点击的是其他的按钮或者图片时,会让不是我们点击的图片或者按钮发生改变,而是其他的会改变。也就是所被改变的那个元素是根据我们所选择的来改变,我们的选择操控着那个元素是否发生改变。

保存好了之后运行查看我们的页面效果

也就是说我们完全可以根据我们的按钮来控制我们其他的元素发送改变,这个就是我们内置事件的处理。

2.Vue3的自定义模板

1.如何Vue3的自定义模板

首先找到我们的创建页面

我们会发现只有系统默认提供的页面,那么我们一个如何创建一个模板页面呢

首先创建一个默认的页面去除我们不需要的属性,在加上我们需要的属性后保存。

再次点击我们的创建页面,会发现在下方有一个自定义模板的选项,点击

来到我们的文件夹后,创建一个文本文件切记拓展名要改为 vue否则无法使用

将我们之前的页面全部元素复制进入我们的新建模板页面中去

保存好了之后关闭我们的自定义模板页面,再次点击我们的创建页面会发现我们刚刚创建的模板页面已经出现在了我们的选项中,选中我们刚刚新建的模板页面,还是之前的创建模板页面的过程,这样就可以使用我们自定义的模板页面了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值