ligerui框架有哪些代码示例

LigerUI 是一个基于 React 的 UI 组件库，提供了丰富的组件以支持快速开发。以下是一些 LigerUI 框架的代码示例：

1. 按钮组件：

import React from 'react'; import { Button } from 'ligerui';  const App = () => {   return (     <div>       <Button type="primary">Primary Button</Button>       <Button type="secondary">Secondary Button</Button>     </div>   ); };  export default App; 

2. 表单组件：

import React from 'react'; import { Form, Input, Select } from 'ligerui';  const App = () => {   return (     <Form>       <Form.Item label="Username">         <Input />       </Form.Item>       <Form.Item label="Password">         <Input.Password />       </Form.Item>       <Form.Item label="Gender">         <Select>           <Option value="male">Male</Option>           <Option value="female">Female</Option>         </Select>       </Form.Item>       <Form.Item>         <Button type="primary">Submit</Button>       </Form.Item>     </Form>   ); };  export default App; 

3. 表格组件：

import React from 'react'; import { Table } from 'ligerui';  const App = () => {   const columns = [     { title: 'Name', dataIndex: 'name' },     { title: 'Age', dataIndex: 'age' },     { title: 'Address', dataIndex: 'address' },   ];    const dataSource = [     {       key: '1',       name: 'John Brown',       age: 32,       address: 'New York No. 1 Lake Park',     },     {       key: '2',       name: 'Jim Green',       age: 42,       address: 'London No. 1 Lake Park',     },     {       key: '3',       name: 'Joe Black',       age: 32,       address: 'Sidney No. 1 Lake Park',     },   ];    return (     <Table columns={columns} dataSource={dataSource} />   ); };  export default App; 

4. 弹窗组件：

import React, { useState } from 'react'; import { Modal, Button } from 'ligerui';  const App = () => {   const [visible, setVisible] = useState(false);    const showModal = () => {     setVisible(true);   };    const handleCancel = () => {     setVisible(false);   };    return (     <div>       <Button type="primary" onClick={showModal}>         Open Modal       </Button>       <Modal visible={visible} onCancel={handleCancel}>         <h2>Modal Title</h2>         <p>Modal content</p>       </Modal>     </div>   ); };  export default App; 

以上示例展示了如何使用 LigerUI 框架中的按钮、表单、表格和弹窗组件。更多组件和用法，请参考 LigerUI 的官方文档和示例。