UNPKG

@antmjs/vantui

Version:

一套适用于Taro3及React的vantui组件库

71 lines (70 loc) 3.46 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = Demo; var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); var _react = _interopRequireDefault(require("react")); var _components = require("@tarojs/components"); var _vantui = require("@antmjs/vantui"); var _jsxRuntime = require("react/jsx-runtime"); function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /* eslint-disable */ function Demo() { var it = _react.default.useRef(null); var _react$useState = _react.default.useState({ option1: [{ text: '全部商品', value: 0 }, { text: '新款商品', value: 1 }], value1: 0, switch: false, result: '' }), _react$useState2 = (0, _slicedToArray2.default)(_react$useState, 2), state = _react$useState2[0], setState = _react$useState2[1]; var changeState = _react.default.useCallback(function (type, value) { setState(_objectSpread(_objectSpread({}, state), {}, (0, _defineProperty2.default)({}, type, value))); }, [state]); var onConfirm = _react.default.useCallback(function () { var _it$current; (_it$current = it.current) === null || _it$current === void 0 ? void 0 : _it$current.toggle(); changeState('result', state.switch ? '打开状态' : '关闭状态'); }, [it, changeState]); return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_vantui.DropdownMenu, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.DropdownItem, { value: state.value1, options: state.option1 }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_vantui.DropdownItem, { ref: it, title: state.result, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.Cell, { title: "\u9009\u62E9\u5F00\u5173", renderRightIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.Switch, { size: "24px", style: "height: 26px", checked: state.switch, activeColor: "#ee0a24", onChange: function onChange() { return changeState('switch', !state.switch); } }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.View, { style: "padding: 5px 16px;", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.Button, { type: "danger", block: true, round: true, onClick: onConfirm, children: "\u786E\u8BA4" }) })] })] }); }