Vue에서 필터를 사용하는 방법

Vue의 필터는 일반적으로 일부 일반적인 텍스트 형식에 사용됩니다. 필터는 이중 중괄호 보간 및 v-bind 표현식의 두 위치에서 사용될 수 있습니다. 이 글은 웹 프론트엔드 Vue 필터 관련 지식을 소개합니다. 관심 있는 친구들은 함께 살펴보세요.

Vue 필터는 일반적으로 몇 가지 일반적인 텍스트 형식에 사용됩니다. Double Flower. 대괄호 보간 및 v-바인드 표현식.

예를 들어 가격에 중국 돈 문자 "옌"을 자동으로 추가하거나 기간 또는 (타임스탬프) 간의 변환을 필터링합니다.

javascript와 jquery의 시대! 기간의 표시나 제출을 표시하거나 제출할 때 변환해야 하는데, 이게 좀 번거롭습니다(개인적으로 Vue를 사용하고 나서 번거로움을 느낍니다).

더 설명하지 않고 다음과 같이 예시를 살펴보겠습니다.

filter로 정의된 필터는 로컬 또는 글로벌일 수 있습니다. 아래에서는 평소처럼 전역 필터 키워드(filter)를 등록하는 것이 좋습니다. ) 먼저. 위의 표시 시간

Vue.filter('dateconversion', function (value) { // 一个时间戳转正常的过滤器
 let date = new Date(value) // nuw 一个时间
 let getHours // 小时
 let getMinutes // 分
 if(date.getHours() < 10){getHours = "0"+date.getHours()}else{ getHours = date.getHours()}
// 判断小时是否小于10的补全：加0
 if(date.getMinutes() < 10){getMinutes = "0"+date.getMinutes()}else{ getMinutes = date.getMinutes()}
// 判断分是否小于10的补全：加0
 return date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+ getHours +":"+ getMinutes // 返回转换后的值
})

을 모두를 위해 정리했습니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

위 내용은 Vue에서 필터를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!