Change-Id: I76d0f72679cd75085f5ffd42f641daa198cafe11 docs: update docs for alert/autocomplete/carousel, etc. Change-Id: Ib7507f4979024f53c127e4b64b88560b93999db7 fix: update for autocomplete filter Change-Id: Ie54556715fa52838aeb6caaa19b4f9a9f14b490f docs: add docs for calendar/transfer/cascader Change-Id: I655b3cb3d25dd0649de9ae7e224e7063a40dd079 fix: add more demos for input/textarea Change-Id: Iada527ca82643a435a4775110b332155512d62a7 docs: add docs for uploader,select,table, etc. Change-Id: Ib034fd5cc9d9a420d4e002956ae925175783c5f3 docs: adjust formatting and punc. docs: adjust docs for uploader, etc. Change-Id: If06c8c1102eafce43f5802a333676fc9e62cd474 docs: add docs for nav Change-Id: If56a653ec53f19239606128fd30cae80f8e10025 docs: improve anchor demos Change-Id: I6ac1c08cc8905924d0062def1f8921fe1f302f15 docs: refine wording and format docs: update docs for check-button-group desc Change-Id: Ica7d6d0692250f0be6bd330b1ad4cc41938afd46
		
			
				
	
	
		
			115 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			115 lines
		
	
	
		
			2.1 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
| <article class="autocomplete-normal-demo">
 | |
|   <section>
 | |
|     <h3>suggest on input</h3>
 | |
|     <veui-autocomplete
 | |
|       :datasource="suggestions"
 | |
|       placeholder="请输入"
 | |
|       clearable
 | |
|     />
 | |
|   </section>
 | |
|   <section>
 | |
|     <h3>suggest on focus</h3>
 | |
|     <veui-autocomplete
 | |
|       :datasource="coffees"
 | |
|       placeholder="请输入"
 | |
|       suggest-trigger="focus"
 | |
|     />
 | |
|   </section>
 | |
| </article>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import { Autocomplete } from 'veui'
 | |
| 
 | |
| export default {
 | |
|   components: {
 | |
|     'veui-autocomplete': Autocomplete
 | |
|   },
 | |
|   data () {
 | |
|     return {
 | |
|       suggestions: [
 | |
|         {
 | |
|           value: 'Moka'
 | |
|         },
 | |
|         {
 | |
|           value: 'Turkish'
 | |
|         },
 | |
|         {
 | |
|           value: 'latte'
 | |
|         },
 | |
|         {
 | |
|           value: 'cappuccino'
 | |
|         }
 | |
|       ],
 | |
|       coffees: [
 | |
|         {
 | |
|           label: 'Infused',
 | |
|           value: 'infused',
 | |
|           options: [
 | |
|             {
 | |
|               label: 'French press',
 | |
|               value: 'french-press'
 | |
|             },
 | |
|             {
 | |
|               label: 'Cold brew',
 | |
|               value: 'cold-brew'
 | |
|             }
 | |
|           ]
 | |
|         },
 | |
|         {
 | |
|           label: 'Espresso',
 | |
|           value: 'espresso',
 | |
|           options: [
 | |
|             {
 | |
|               label: 'Espresso Romano',
 | |
|               value: 'espresso-romano'
 | |
|             },
 | |
|             {
 | |
|               label: 'Guillermo',
 | |
|               value: 'guillermo'
 | |
|             },
 | |
|             {
 | |
|               label: 'Ristretto',
 | |
|               value: 'ristretto'
 | |
|             }
 | |
|           ]
 | |
|         },
 | |
|         {
 | |
|           label: 'Milk coffee',
 | |
|           value: 'milk-coffee',
 | |
|           options: [
 | |
|             {
 | |
|               label: 'Latte',
 | |
|               value: 'latte'
 | |
|             },
 | |
|             {
 | |
|               label: 'Macchiato',
 | |
|               value: 'macchiato'
 | |
|             },
 | |
|             {
 | |
|               label: 'Cappuccino',
 | |
|               value: 'cappuccino'
 | |
|             },
 | |
|             {
 | |
|               label: 'White coffee',
 | |
|               value: 'white-coffee'
 | |
|             }
 | |
|           ]
 | |
|         }
 | |
|       ]
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style lang="less" scoped>
 | |
| .autocomplete-normal-demo {
 | |
|   display: flex;
 | |
| 
 | |
|   section + section {
 | |
|     margin-left: 60px;
 | |
|   }
 | |
| }
 | |
| </style>
 |