项目作者: tookit

项目描述 :
A missing cascader select for vuetify
高级语言: Vue
项目地址: git://github.com/tookit/vuetify-cascader.git
创建时间: 2021-03-02T04:47:07Z
项目社区:https://github.com/tookit/vuetify-cascader

开源协议:

下载


vuetify-cascader

A missing cascader select for vuetify

This repo will be archived, please migrate to [https://github.com/tookit/vmajs]

Demo

http://vma.isocked.com/#/element/cascader/

example

Installation

  1. # npm
  2. npm install vuetify-cascader
  3. # Yarn
  4. yarn add vuetify-cascader

Props

Name Type Default Required? Description
items Array [] Y A nested data set
itemValue String value N Set property of items’s value - must be primitive.
itemText String value N Set property of items’s text value
outlined Boolean false N Applies the outlined style to the input
label String null N Set input’s label

Usage

  1. <template>
  2. <v-app id="app">
  3. <v-container>
  4. <v-row>
  5. <v-col cols="12" md="6">
  6. <v-cascader
  7. v-model="selectedItem"
  8. label="Select Product"
  9. item-value="id"
  10. item-text="text"
  11. :items="items"
  12. outlined
  13. ></v-cascader>
  14. </v-col>
  15. </v-row>
  16. </v-container>
  17. </v-app>
  18. </template>
  19. <script>
  20. import VCascader from './components/VCascader.vue'
  21. export default {
  22. components: {
  23. VCascader,
  24. },
  25. data() {
  26. return {
  27. items: [
  28. {
  29. id: 1,
  30. text: 'Phone',
  31. value: 'phone',
  32. children: [
  33. ...
  34. ],
  35. },
  36. ],
  37. selectedItem: null,
  38. }
  39. },
  40. }
  41. </script>

For other uses see examples: https://github.com/tookit/vuetify-cascader/blob/master/src/App.vue