mirror of
				https://gitee.com/vant-contrib/vant.git
				synced 2025-10-31 03:22:08 +08:00 
			
		
		
		
	
		
			
				
	
	
		
			66 lines
		
	
	
		
			923 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			66 lines
		
	
	
		
			923 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <div id="docsearch" />
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: 'VanDocSearch',
 | |
| 
 | |
|   props: {
 | |
|     lang: String,
 | |
|     searchConfig: Object,
 | |
|   },
 | |
| 
 | |
|   watch: {
 | |
|     lang() {
 | |
|       this.initDocsearch();
 | |
|     },
 | |
|   },
 | |
| 
 | |
|   mounted() {
 | |
|     this.initDocsearch();
 | |
|   },
 | |
| 
 | |
|   methods: {
 | |
|     initDocsearch() {
 | |
|       if (this.searchConfig) {
 | |
|         import('@docsearch/css');
 | |
|         import('@docsearch/js').then((docsearch) => {
 | |
|           docsearch.default({
 | |
|             ...this.searchConfig,
 | |
|             container: '#docsearch',
 | |
|           });
 | |
|         });
 | |
|       }
 | |
|     },
 | |
|   },
 | |
| };
 | |
| </script>
 | |
| 
 | |
| <style lang="less">
 | |
| @import '../../common/style/var';
 | |
| 
 | |
| #docsearch {
 | |
|   display: inline-block;
 | |
|   vertical-align: middle;
 | |
| }
 | |
| 
 | |
| .DocSearch-Button {
 | |
|   height: 32px;
 | |
|   background: #f7f8fa;
 | |
| 
 | |
|   &:hover {
 | |
|     box-shadow: none;
 | |
|   }
 | |
| }
 | |
| 
 | |
| .DocSearch-Search-Icon {
 | |
|   width: 18px;
 | |
|   height: 18px;
 | |
| }
 | |
| 
 | |
| .DocSearch-Button-Key {
 | |
|   font-size: 12px;
 | |
| }
 | |
| </style>
 |