docs: Update QR Code basic demo (#41614)

* docs: Update qr code demo

* docs: update demo
This commit is contained in:
二货爱吃白萝卜 2023-04-03 22:34:05 +08:00 committed by GitHub
parent bea224b71d
commit 1a1fdf0cee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 70 additions and 16 deletions

View File

@ -45,6 +45,13 @@ Array [
`;
exports[`renders components/qrcode/demo/base.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical ant-space-align-center"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-qrcode"
style="width: 160px; height: 160px;"
@ -55,6 +62,19 @@ exports[`renders components/qrcode/demo/base.tsx extend context correctly 1`] =
width="134"
/>
</div>
</div>
<div
class="ant-space-item"
>
<input
class="ant-input"
maxlength="60"
placeholder="-"
type="text"
value="https://ant.design/"
/>
</div>
</div>
`;
exports[`renders components/qrcode/demo/customColor.tsx extend context correctly 1`] = `

View File

@ -10,6 +10,13 @@ exports[`renders components/qrcode/demo/Popover.tsx correctly 1`] = `
`;
exports[`renders components/qrcode/demo/base.tsx correctly 1`] = `
<div
class="ant-space ant-space-vertical ant-space-align-center"
>
<div
class="ant-space-item"
style="margin-bottom:8px"
>
<div
class="ant-qrcode"
style="width:160px;height:160px"
@ -20,6 +27,19 @@ exports[`renders components/qrcode/demo/base.tsx correctly 1`] = `
width="134"
/>
</div>
</div>
<div
class="ant-space-item"
>
<input
class="ant-input"
maxlength="60"
placeholder="-"
type="text"
value="https://ant.design/"
/>
</div>
</div>
`;
exports[`renders components/qrcode/demo/customColor.tsx correctly 1`] = `

View File

@ -1,6 +1,20 @@
import { Input, QRCode, Space } from 'antd';
import React from 'react';
import { QRCode } from 'antd';
const App: React.FC = () => <QRCode value="https://ant.design/" />;
const App: React.FC = () => {
const [text, setText] = React.useState('https://ant.design/');
return (
<Space direction="vertical" align="center">
<QRCode value={text || '-'} />
<Input
placeholder="-"
maxLength={60}
value={text}
onChange={(e) => setText(e.target.value)}
/>
</Space>
);
};
export default App;