vue.2.4.0.js_YouZan的Vue.js 2.0移动用户界面

vue.2.4.0.js

先锋 (vant)

A Vue.js 2.0 Mobile UI at YouZan.

YouZan的Vue.js 2.0移动用户界面。

特征 (Features)

• Components come from wechat mall business of YouZan

  组件来自友赞微信商城业务

• Extensive documentation and demos.

  大量的文档和演示。

• Support babel-plugin-import

  支持babel-plugin-import

• Unit test coverage over 90%

  单元测试覆盖率超过90％

• Not only have the basic components, but also have a lot of business components

  不仅具有基本组件，而且还具有许多业务组件

View demo 查看演示 Download Source 下载源

安装 (Install)

npm i -S vant

快速开始 (Quickstart)

1.使用babel-plugin-import (推荐) (1. Use babel-plugin-import (Recommended))

# Install babel-plugin-import
npm i babel-plugin-import -D

// set babel config in .babelrc or babel-loader
{
  "plugins": [
    ["import", { "libraryName": "vant", "style": true }]
  ]
}

Then you can import components from vant, equivalent to import manually below.

然后，您可以从vant导入组件，等效于下面的手动导入。

import { Button } from 'vant';

2.手动导入 (2. Manually import)

import { Button } from 'vant/lib/button';
import 'vant/lib/vant-css/base.css';
import 'vant/lib/vant-css/button.css';

3.导入所有组件 (3. Import all components)

import Vue from 'vue';
import Vant from 'vant';
import 'vant/lib/vant-css/index.css';

Vue.use(Vant);

CDN (CDN)

<!-- import style -->
<link rel="stylesheet" href="https://unpkg.com/vant/lib/vant-css/index.css" />

<!-- import script --><script></script>
<script src="https://unpkg.com/vant/lib/vant.min.js"></script>

翻译自: https://vuejsexamples.com/a-vue-js-2-0-mobile-ui-at-youzan/

vue.2.4.0.js