https://github.com/vinayakkulkarni/v-intl-listformat
Tiny vue component for Intl.ListFormat
https://github.com/vinayakkulkarni/v-intl-listformat
intl intl-listformat listformat vintl-listformat vue vue2 vuejs vuejs2
Last synced: 3 months ago
JSON representation
Tiny vue component for Intl.ListFormat
- Host: GitHub
- URL: https://github.com/vinayakkulkarni/v-intl-listformat
- Owner: vinayakkulkarni
- License: mit
- Created: 2019-01-10T05:39:38.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-03-26T05:59:10.000Z (over 1 year ago)
- Last Synced: 2025-03-18T15:48:45.636Z (3 months ago)
- Topics: intl, intl-listformat, listformat, vintl-listformat, vue, vue2, vuejs, vuejs2
- Language: JavaScript
- Homepage: https://bit.ly/v-intl-listformat
- Size: 243 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# v-intl-listformat :zap: [](https://travis-ci.org/vinayakkulkarni/v-intl-listformat)
![]()
![]()
+ Tiny Vue component for [Intl.ListFormat](https://www.chromestatus.com/feature/4764538272481280)
+ This is [on GitHub](https://github.com/vinayakkulkarni/v-intl-listformat) so let me know if I've b0rked it somewhere, give me a star :star: if you like it :beers:
+ Demo here -> [💯 Codesandbox Demo](https://bit.ly/v-intl-listformat)
## Requirements
* [Vue.js](https://vuejs.org/) 2.x
## :white_check_mark: Install :ok_hand:
```bash
npm install v-intl-listformat --save
// or
yarn add v-intl-listformat
```CDN: [UNPKG](https://unpkg.com/v-intl-listformat/dist/) | [jsDelivr](https://cdn.jsdelivr.net/npm/v-intl-listformat/dist/) (available as `window.VIntlListFormat`)
## :white_check_mark: Usage :mortar_board:
Register the component globally:
```javascript
Vue.component('IntlListFormat', require('v-intl-listformat'));
```
Or use locally
```javascript
import IntlListFormat from 'v-intl-listformat';
```## :white_check_mark: Example 1 :four_leaf_clover:
```html
// → 'Frank and Christine'
``````javascript
Vue.component('example-component', {
data() {
return {
name: ['Frank', 'Christine'],
};
}
});
```### :white_check_mark: :book: Props
| Name | Type | Required? | Default | Description |
| --- | --- | --- | --- | --- |
| `payload` | Array | Yes | `[]` | Locale you want to initialise the formatting to be done. |
| `locale` | String | No | `en` | Locale you want to initialise the formatting to be done. |
| `type` | String | No | `null` | Type can be `disjunction` or `unit`. |
| `style` | String | No | `null` | Style is passed with type, values can be `short` or `narrow`. |## NPM :octocat:
[](https://nodei.co/npm/v-intl-listformat/)
## Contributing
1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D## Author
**v-intl-listformat** © [Vinayak](https://github.com/vinayakkulkarni), Released under the [MIT](./LICENSE) License.
Authored and maintained by Vinayak Kulkarni with help from contributors ([list](https://github.com/vinayakkulkarni/v-intl-listformat/contributors)).> [vinayak.pw](https://vinayak.pw) · GitHub [@vinayakkulkarni](https://github.com/vinayakkulkarni) · Twitter [@\_vinayak_k](https://twitter.com/_vinayak_k)