antd怎么修改form组件中提交按钮的样式
可以使用Button组件的style属性来修改按钮的样式。例如:
import { Form, Input, Button } from 'antd';
const layout = {
labelCol: { span: 8 },
wrapperCol: { span: 16 },
};
const tailLayout = {
wrapperCol: { offset: 8, span: 16 },
};
const Demo = () => {
const onFinish = (values) => {
console.log(values);
};
return (
<Form
{...layout}
name="basic"
initialValues={{ remember: true }}
onFinish={onFinish}
>
<Form.Item
label="Username"
name="username"
rules={[{ required: true, message: 'Please input your username!' }]}
>
<Input />
</Form.Item>
<Form.Item
label="Password"
name="password"
rules={[{ required: true, message: 'Please input your password!' }]}
>
<Input.Password />
</Form.Item>
<Form.Item {...tailLayout}>
<Button type="primary" htmlType="submit" style={{ background: 'red', borderColor: 'blue' }}>
Submit
</Button>
</Form.Item>
</Form>
);
};
export default Demo;
在上述例子中,使用了Button组件的style属性,将背景颜色设为红色,边框颜色设为蓝色。可以根据需要修改样式。
原文地址: https://www.cveoy.top/t/topic/bEe9 著作权归作者所有。请勿转载和采集!