老师,想实现个小功能没思路

老师,想实现个小功能没思路

在input框放了icon,想实现密码的显隐藏

第一种方式,一直报错找不到onclick事件

//获取input框
const inputCont=document.getElementById('inputCont')
//获取span
const inputConts=document.getElementById('inputConts')
let exhibition=false;
//点击小图标实现密码的显隐藏
inputConts.onclick=function(){
exhibition=!exhibition
if(exhibition){
inputCont.type='text'
inputConts.innerHTML=''
}else{
inputCont.type='password'
inputConts.innerHTML=''
}
}

第二种方式,在setup中使用onMounted,也是没有思路,请老师指点一下


http://img1.sycdn.imooc.com//climg/612b6497097f515d03950378.jpg



正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕慕子 2021-08-30 10:29:22

同学你好,对于你的问题解答如下:

1、vue中不可以使用getElementById, onclick等方法,所以粘贴的代码这种写法会出现报错。

2、老师给提供一个简单的参考实现思路,可以结合注释文字理解,示例:

http://img1.sycdn.imooc.com//climg/612c41cb09d68af409340826.jpg

http://img1.sycdn.imooc.com//climg/612c41d90961b0ba09750318.jpg

效果如下:

http://img1.sycdn.imooc.com//climg/612c426f0a98bed405010388.jpg

老师这里也想给同学提一个小建议,推荐同学先将视频中讲解的内容完全掌握后,再去拓展自己想要实现的功能,这样对同学的学习会更有帮助哦。

祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师