@cainiaofe/cn-ui-m
Version:
42 lines (41 loc) • 2.02 kB
JavaScript
import { __spreadArray } from "tslib";
import * as React from 'react';
import { CnDemoPage, CnInput, CnTag, CnDemoBlock } from "../../..";
var _eventList = [];
export var 事件 = function () {
var _a = React.useState([]), eventList = _a[0], setEventList = _a[1];
var addEvt = function (type, value) {
if (value === void 0) { value = ''; }
_eventList.push({ type: type, value: value });
setEventList(__spreadArray([], _eventList, true));
};
return (React.createElement(CnDemoPage, { title: "\u4E8B\u4EF6" },
React.createElement(CnDemoBlock, { title: "\u4E8B\u4EF6\u54CD\u5E94" },
React.createElement(CnInput, { placeholder: "\u8BF7\u8F93\u5165", hasClear: true, onFocus: function () {
addEvt('focus');
}, onBlur: function () {
addEvt('blur');
}, onConfirm: function (val) {
addEvt('confirm', val);
}, onClear: function () {
addEvt('clear');
}, onChange: function (val) {
addEvt('change', val);
} })),
React.createElement(CnDemoBlock, { title: "\u8BB0\u5F55" },
React.createElement("div", null, eventList.map(function (item, index) {
return (React.createElement("div", { key: "evt-".concat(index) },
React.createElement(CnTag, { style: {
color: '#fff',
background: '#8BC34A',
border: 'none',
paddingLeft: 'var(--m-s-4)',
paddingRight: 'var(--m-s-4)',
marginRight: 'var(--m-s-4)',
} }, item.type),
React.createElement("span", null, item.value || '')));
})))));
};
事件.desc =
'支持 onFocus， onBlur， onChange， onConfirm(部分场景), onClear 事件';
export default { title: 'demo/CnInput' };