@antmjs/vantui
Version:
一套适用于Taro3及React的vantui组件库
138 lines • 3.92 kB
JavaScript
import { View } from '@tarojs/components';
import { Row, Col, Icon } from '@antmjs/vantui';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
export default function Demo() {
return /*#__PURE__*/_jsxs(View, {
style: {
overflow: 'hidden'
},
children: [/*#__PURE__*/_jsxs(Row, {
children: [/*#__PURE__*/_jsx(View, {
className: "demo-block__title",
children: "\u57FA\u672C\u7528\u6CD5"
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "32px",
className: "icon"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "https://b.yzcdn.cn/vant/icon-demo-1126.png",
size: "32px",
className: "icon"
})
})]
}), /*#__PURE__*/_jsxs(Row, {
children: [/*#__PURE__*/_jsx(View, {
className: "demo-block__title",
children: "\u63D0\u793A\u4FE1\u606F"
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "32px",
className: "icon",
dot: true
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "32px",
className: "icon",
info: "9"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "32px",
className: "icon",
info: "99+"
})
})]
}), /*#__PURE__*/_jsxs(Row, {
children: [/*#__PURE__*/_jsx(View, {
className: "demo-block__title",
children: "\u56FE\u6807\u989C\u8272"
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
color: "#1989fa",
name: "chat-o",
size: "32px",
className: "icon"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
color: "#07c160",
name: "chat-o",
size: "32px",
className: "icon"
})
})]
}), /*#__PURE__*/_jsxs(Row, {
children: [/*#__PURE__*/_jsx(View, {
className: "demo-block__title",
children: "\u56FE\u6807\u5927\u5C0F"
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "40",
className: "icon"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "chat-o",
size: "3rem",
className: "icon"
})
})]
}), /*#__PURE__*/_jsxs(Row, {
children: [/*#__PURE__*/_jsx(View, {
className: "demo-block__title",
children: "\u81EA\u5B9A\u4E49\u56FE\u6807"
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "demo1",
classPrefix: "page-icon",
size: "40px"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "demo2",
classPrefix: "page-icon",
size: "40px"
})
}), /*#__PURE__*/_jsx(Col, {
className: "col",
span: "6",
children: /*#__PURE__*/_jsx(Icon, {
name: "demo3",
classPrefix: "page-icon",
size: "40px"
})
})]
})]
});
}