KUI for Vue

邱秋2年前 19:11

一枚前端 UI 组件库 KUI for Vue

KUI for Vue

基于 VUE 2.x 开发,漂亮的 UI,可定制主题 , 组件丰富, 支持 SSR , 支持 Nuxt , 兼容 IE9。
欢迎批评、指正、吐槽、Star捐助

开发

npm run dev

编译

//编译文档
npm run build:docs
//编译组件
npm run build

文档

Docs:https://vue.k-ui.cn
Blog:http://www.chuchur.com
Github:https://github.com/chuchur-china/kui-vue

特性

漂亮的 UI,可定制主题
兼容 IE9+
支持 SSR
支持 Nuxt
组件丰富

For React

kui-react

更新日志:

Logs:https://vue.k-ui.cn/#log

安装

使用 npm

npm install kui-vue --save

使用 CDN

<!-- import Vue.js -->
<script src="//vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" href="//unpkg.com/kui-vue/dist/k-ui.css" />
<!-- import kui -->
<script src="//unpkg.com/kui-vue/dist/k-ui.js"></script>

示例

<! DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8" />
    <title>kui example</title>
    <link
      rel="stylesheet"
      type="text/css"
      href="http://unpkg.com/kui-vue/dist/k-ui.css"
    />
    <script
      type="text/javascript"
      src="http://vuejs.org/js/vue.min.js"
    ></script>
    <script
      type="text/javascript"
      src="http://unpkg.com/kui-vue/dist/k-ui.js"
    ></script>
  </head>

  <body>
    <div id="app">
      <k-button @click="show">Click me!</k-button>
      <Modal v-model="visible" title="Welcome">Welcome to use kui</Modal>
    </div>
    <script>
      new Vue({
        el: "#app",
        data: {
          visible: false,
        },
        methods: {
          show: function () {
            this.visible = true;
          },
        },
      });
    </script>
  </body>
</html>

本文于2年前 19:11发布在[project]分类下,当前已被围观7634次

相关标签:vue

永久地址:https://www.chuchur.com/article/vue-kui

版权声明:自由转载-署名-非商业性使用