更新记录

1.0.2（2023-07-12） 下载此版本

更新已知

1.0.1（2023-07-12） 下载此版本

增加css

1.0.0（2023-07-12） 下载此版本

参照 Vant 打造的移动端组件库

平台兼容性

VantUI

Download dependency

首先下载依赖组件

yarn add js-base64

注意，如果yarn报错

在package.json的name不能有中文

{
    "id": "myuan-vantUI",
    "name": "Vue 3高仿vantUI组件", // 这里不支持中文
    "displayName": "Vue 3高仿vantUI组件",

}

然后在App.vue 引入 全局css

@import "./components/myuan-vantUI/index.css";
@import "./components/myuan-vantUI/iconfont.css";
@import "./components/myuan-vantUI/yangshi.css";

引入

在pages.json

"easycom": {
    "autoscan": true,
    "custom": {
        "^van-(.*)": "@/components/myuan-vantUI/$1.vue"
    }
},

交流群

微信

事例

<van-button type="primary">主要按钮</van-button>
<van-button type="success">成功按钮</van-button>
<van-button type="default">默认按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>

<van-cell-group>
  <van-cell title="单元格" value="内容" />
  <van-cell title="单元格" value="内容" label="描述信息" />
</van-cell-group>

<van-icon name="chat-o" />

...
更多事例请看以下API

Refer to official website

API 参考网站.