반응형
문자열로 저장된 Vuex float based store 값
나는 내 데스크탑에 Vuejs 프런트엔드 프로젝트를 만들었다.나는 중앙집중식 국가 관리를 위해 Vuex를 사용하고 있다.나는 내 주에 TotalAssummount와 Evenue 값을 가지고 있고 나는 그 두 주에 대해 추가 및 감산 작업을 하려고 한다.물론, 잘 하는 일은 줄이고, 주정부와 연계하는 기능을 늘려야 한다.다음과 같이 가정해 보자.
TotalProfit:1.05465
Profit:0.0012
함수 반환을 늘리다1.054650.0012
.
Store.js 파일:
const state = {
TotalBalance: 0,
Profit:0.00000000
};
const actions = {
setTotalBalance(context, data) {
context.commit('setTotalBalance', parseFloat(data).toFixed(8))
},
increaseTotalBalance(context, data) {
context.commit('increaseTotalBalance', parseInt(data).toFixed(8))
},
decreaseTotalBalance(context, data) {
context.commit('decreaseTotalBalance', parseFloat(data).toFixed(8))
},
setProfit(context, data) {
context.commit('setProfit', data)
},
}
const mutations = {
setTotalBalance(state,TotalBalance){
state.TotalBalance = Number(parseFloat(TotalBalance).toFixed(8));
},
increaseTotalBalance(state,Balance){
state.TotalBalance = Number(parseFloat(state.TotalBalance ).toFixed(8))+Number(parseFloat(Balance).toFixed(8))
},
decreaseTotalBalance(state,Balance){
state.TotalBalance = parseFloat(state.TotalBalance ).toFixed(8)-parseFloat(Balance).toFixed(8)
},
setProfit(state,Profit){
state.Profit = Number(parseFloat(Profit).toFixed(8))
}
}
const getters = {
getTotalBalance: state=>{
return state.TotalBalance
},
getProfit: state => {
return state.Profit
}
}
export default new Vuex.Store({
state,
getters,
mutations,
actions
})
위의 파일에서 보듯이, 나는 여러 가지 방법을 시도했지만 스스로 해결책을 찾지 못했다.
ToFixed는 문자열을 반환하므로 연결된 문자열을 얻으십시오.대신 너는 할 수 있다.+string
문자열을 숫자로 변환하고 표시해야 할 때 getter에서 8자리를 자르려면:
const store = new Vuex.Store({
state: {
TotalBalance: 1.05465,
Profit: 0.0012
},
mutations: {
increaseTotalBalance(state,Balance){
state.TotalBalance = +state.TotalBalance + +Balance;
},
decreaseTotalBalance(state,Balance){
state.TotalBalance = +state.TotalBalance - +Balance;
},
}
})
new Vue({
el: '#app',
store,
computed: {
total: function() {
return Number(this.$store.state.TotalBalance).toFixed(8);
},
profit: function() {
return Number(this.$store.state.Profit).toFixed(8);
}
},
methods: {
inc: function() {
this.$store.commit('increaseTotalBalance', this.profit)
},
dec: function() {
this.$store.commit('decreaseTotalBalance', this.profit)
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.0/vue.js"></script>
<script src="https://unpkg.com/vuex@2.3.1"></script>
<div id="app">
<p>{{ total }}, {{ profit }}</p>
<button @click="inc">Inc</button>
<button @click="dec">Dec</button>
</div>
참조URL: https://stackoverflow.com/questions/44637839/vuex-float-based-store-value-stored-as-string
반응형
'IT이야기' 카테고리의 다른 글
JS 인덱스개체 배열 및 스플라이스()가 올바른 개체를 제거하지 않음 (0) | 2022.04.12 |
---|---|
VUE에서 선호하는 템플릿 및 로직 공유 접근 방식 (0) | 2022.04.12 |
$route.params를 시청하십시오.슬러그가 vuej를 트리거하지 않음 (0) | 2022.04.12 |
vuejs 기록 모드 라우팅 (0) | 2022.04.12 |
VueJs: 구성 요소 내부의 루트 요소에서 방법 사용 (0) | 2022.04.12 |