반응형
Vue.Js 2 입력 형식 번호
나는 vuejs2를 사용하여 숫자 포맷을 위한 숫자 입력을 얻기 위해 고군분투해왔다.
일부 뷰 논리를 asp.net core 2에서 vue로 마이그레이션하는 중.
<input asp-for="Model.LoanAmount" value="@(Model.LoanAmount > 0 ? Model.LoanAmount.ToString("N2") : String.Empty)" >
입력 변경에 대한 관점을 다시 로드해야 했어
숫자 입력을 미국 형식과 소수점 2자리(100만.21)로 포맷하되 모델 값이 0이거나 비어 있을 때는 아무것도 표시하지 않는 방법이 필요하다.
vue-numeric은 거의 모든 것을 하지만 내가 자리 표시자를 사용하려고 할 때 나는 실패한다.
<vue-numeric v-model="vm.loanAmount" seperator="," placeholder=" " :precision="2" ></vue-numeric>
빈 문자열을 사용하면 충돌하기 때문에 자리 표시자 공간을 사용해 보았다.0 또는 빈 값이 입력된 경우 이 예는 0.00을 표시한다.나는 출력 타입과 빈 값 소품들을 가지고 놀려보았다.
나는 부랑자와 결혼하지는 않았지만 더 편리한 해결책을 몰라서 편리하다.
당신은 단지 a를 사용함으로써 포맷을 할 수 있다.computed
별개의 재산getter
, 그리고setter
다른 의존성 없이 말이야
computed: {
formattedValue: {
get: function() {
return this.value;
},
set: function(newValue) {
if (newValue.length > 2) {
newValue = newValue.replace(".", "");
this.value =
newValue.substr(0, newValue.length - 2) +
"." +
newValue.substr(newValue.length - 2);
} else {
this.value = newValue;
}
}
}
}
https://codesandbox.io/s/p7j447k7wq
십진 분리기를 예시로만 추가했을 뿐인데, 그 부분을 추가해야 할 겁니다.,
세터 내 수천 개의 분리기를 사용하여 전체 기능을 사용할 수 있도록 하십시오.
참조URL: https://stackoverflow.com/questions/53422585/vue-js-2-input-formatting-number
반응형
'programing' 카테고리의 다른 글
Python 3으로 pip을 설치하는 방법? (0) | 2022.04.06 |
---|---|
TypeError를 수정하는 방법:해싱하기 전에 유니코드 객체를 인코딩해야 하는가? (0) | 2022.04.06 |
reactive native로 Android Wear 앱을 만들 수 있는가? (0) | 2022.04.06 |
Vue 앱(Vuetify.js 포함)에서 검증이 포함된 간단한 양식을 구현하는 방법 (0) | 2022.04.06 |
구성 요소/컨테이너에 React 앱을 구성하는 중 (0) | 2022.04.06 |