Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,12 @@ By default the decimal value is disabled. To use decimals in the value, add the
<vue-numeric placeholder="only number allowed"></vue-numeric>
```

### Value when empty
By default, when you clean the input the value is set to `0`. You can change this value to fit your needs.
```vue
<vue-numeric :empty-value="1"></vue-numeric>
```

## Props
|Props|Description|Required|Type|Default|
|-----|-----------|--------|----|-------|
Expand All @@ -140,6 +146,7 @@ By default the decimal value is disabled. To use decimals in the value, add the
|min|Minimum value allowed|false|Number|-9007199254740991|
|minus|Enable/disable negative values|false|Boolean|`false`|
|placeholder|Input placeholder|false|String|-|
|empty-value|Value when input is empty|false|Number|0|
|precision|Number of decimals|false|Number|-|
|separator|Thousand separator symbol (accepts `space`, `.` or `,`)|false|String|`,`|
|read-only|Hide input field and show the value as text|false|Boolean|false|
Expand Down
12 changes: 11 additions & 1 deletion src/vue-numeric.vue
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,15 @@ export default {
type: String
},

/**
* Value when the input is empty
*/
emptyValue: {
default: '',
required: false,
type: [Number, String]
},

/**
* Number of decimals.
* Decimals symbol are the opposite of separator symbol.
Expand Down Expand Up @@ -246,7 +255,8 @@ export default {
* @return {Number}
*/
unformat (value) {
return accounting.unformat(value, this.decimalSeparator)
const toUnformat = typeof value === 'string' && value === '' ? this.emptyValue : value
return accounting.unformat(toUnformat, this.decimalSeparator)
}
},

Expand Down
10 changes: 10 additions & 0 deletions test/specs/vue-numeric.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -202,6 +202,16 @@ describe('vue-numeric.vue', () => {
expect(wrapper.data().amount).to.equal('')
})

it('sets the value to 0 when no empty value is provided and input is empty', () => {
const wrapper = mount(VueNumeric, { propsData: { value: '' }})
expect(wrapper.data().amount).to.equal('0')
})

it('uses the provided empty value when input is empty', () => {
const wrapper = mount(VueNumeric, { propsData: { value: '', emptyValue: 1 }})
expect(wrapper.data().amount).to.equal('1')
})

it('apply min props value if user input negative value when minus props disabled', () => {
const component = Vue.extend({
data: () => ({ total: -200 }),
Expand Down