mirror of
				https://github.com/vuejs/babel-plugin-jsx.git
				synced 2025-10-31 01:12:17 +08:00 
			
		
		
		
	docs: update README
This commit is contained in:
		
							
								
								
									
										54
									
								
								README.md
									
									
									
									
									
								
							
							
						
						
									
										54
									
								
								README.md
									
									
									
									
									
								
							| @@ -4,21 +4,71 @@ To add Vue JSX support. | ||||
|  | ||||
| ## Syntax | ||||
|  | ||||
| ### Content | ||||
| functional component | ||||
|  | ||||
| ```jsx | ||||
| const App = () => <div></div> | ||||
| ``` | ||||
|  | ||||
| with setup render | ||||
| with render | ||||
|  | ||||
| ```jsx | ||||
| const App = { | ||||
|   render() { | ||||
|     return <div>Vue 3.0</div> | ||||
|   } | ||||
| } | ||||
| ``` | ||||
|  | ||||
| ```jsx | ||||
| const App = defineComponent(() => { | ||||
|   const count = ref(0); | ||||
|  | ||||
|   const inc = () => { | ||||
|     count.value++; | ||||
|   }; | ||||
|  | ||||
|   return () => ( | ||||
|     <div> | ||||
|     <div onClick={inc}> | ||||
|       {count.value} | ||||
|     </div> | ||||
|   ) | ||||
| }) | ||||
| ``` | ||||
|  | ||||
| fragment | ||||
|  | ||||
| ```jsx | ||||
| const App = () => ( | ||||
|   <> | ||||
|     <span>I'm</span> | ||||
|     <span>Fragment</span> | ||||
|   </> | ||||
| ) | ||||
| ``` | ||||
|  | ||||
| ### Attributes/Props | ||||
|  | ||||
| ```jsx | ||||
| const App = () => <input type="email" /> | ||||
| ``` | ||||
|  | ||||
| with a dynamic binding: | ||||
|  | ||||
| ```jsx | ||||
| const placeholderText = 'email' | ||||
| const App = () => ( | ||||
|   <input | ||||
|     type="email" | ||||
|     placeholder={placeholderText} | ||||
|   /> | ||||
| ) | ||||
| ``` | ||||
|  | ||||
| ## Compatibility | ||||
|  | ||||
| This repo is only compatible with: | ||||
|  | ||||
| - **Babel 7+** | ||||
| - **Vue 3+** | ||||
|   | ||||
		Reference in New Issue
	
	Block a user