vue 암호 표시 숨 김 전환 기능 구현

1386 단어 vue비밀 번호
먼저 효과 도 를 공유 합 니 다:

구체 적 인 실현 코드 는 다음 과 같다.
html：

<group>
  <span>    </span>
  <x-input :type="this.registration_data.pwdType"  placeholder="     " @on-change="password"></x-input>
　<img :src="this.registration_data.src" @click="changeType()"/>
</group>
script：

data () {

 return {

  registration_data:{

   pwdType:"password",
   src:require("../assets/colse_eyes.png")
  }
 }
},
methods:{
changeType(){
 this.registration_data.pwdType = this.registration_data.pwdType==='password'?'text':'password';
 this.registration_data.src=this.registration_data.src==require("../assets/colse_eyes.png")?require("../assets/open_eyes.png"):require("../assets/colse_eyes.png");
}
}
주:작은 눈 을 가 진 눈 을 뜨 고 닫 습 니 다.
총결산
위 에서 말 한 것 은 편집장 이 소개 한 vue 가 비밀번호 표시 숨 김 전환 기능 을 실현 하 는 것 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 면 메 시 지 를 남 겨 주세요.편집장 은 신속하게 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!
Python 기초 튜 토리 얼 이상 상세 설명
vue.js 2.0 클릭 하여 자신의 속성 과 jquery 방법 얻 기

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage