@cainiaofe/cn-ui-m
Version:
36 lines (35 loc) • 2.23 kB
JavaScript
import React, { useState } from 'react';
import { CnActionSheet, CnBox, CnButton, CnDemoBlock, CnDemoPage, CnMessage, } from "../../..";
export var 基本 = function () {
var _a = useState(false), open1 = _a[0], setOpen1 = _a[1];
var _b = useState(false), open2 = _b[0], setOpen2 = _b[1];
var onClick = function (option, index) {
CnMessage.show({
content: "\u70B9\u51FB\u4E86\u5E8F\u53F7".concat(index),
});
console.log(option);
};
return (React.createElement(CnDemoPage, { title: "\u57FA\u672C" },
React.createElement(CnDemoBlock, { title: "\u57FA\u672C" },
React.createElement(CnBox, { spacing: 12, direction: "column" },
React.createElement("div", null,
React.createElement(CnButton, { type: "secondary", onClick: function () { return setOpen1(true); }, fullWidth: true }, "\u5E38\u89C4\u6A21\u5F0F"),
React.createElement(CnActionSheet, { message: "\u8BF7\u9009\u62E9", visible: open1, onClick: onClick, onClose: function () { return setOpen1(false); }, options: ['选项 1', '选项 2', '选项 3'] })),
React.createElement("div", null,
React.createElement(CnButton, { type: "secondary", onClick: function () { return setOpen2(true); }, fullWidth: true }, "\u56FE\u6807\u6A21\u5F0F"),
React.createElement(CnActionSheet, { message: "\u8BF7\u9009\u62E9\uFF0C\u4E00\u6BB5\u5F88\u957F\u7684\u63D0\u793A\u4E00\u6BB5\u5F88\u957F\u7684\u63D0\u793A", visible: open2, onClick: onClick, onClose: function () { return setOpen2(false); }, align: "left", options: [
{
text: '操作 1',
iconType: 'position',
},
{
text: '操作 2',
iconType: 'position',
},
{
text: '操作 3',
iconType: 'position',
},
] }))))));
};
export default { title: 'demo/CnActionSheet' };