lxj-ui v1.2.4

本项目是本人在校期间完成的基于vue2的ui组件库

安装组件库 npm i lxj-ui

全局引入
   	import LxjUi from 'lxj-ui' 
   	import 'lxj-ui/dist/lxj-ui.css'  
   	Vue.use(LxjUi)

一、button组件

1.参数支持

2.事件支持：

3.样式参考：

二、dialog组件

1.参数支持

2.事件支持

3.插槽的说明

4.样式参考：

三、input组件

1.参数支持

2.事件支持

3.样式参考：

四、switch

1.参数支持

2.事件支持

3.样式参考

五、radio组件

1.参数支持

2.样式参考：

六、radio-group组件

1.参数支持

七、checkout组件

1.参数支持

2.样式参考：

八、checkout-group组件

1.参数支持

九、form组件

1.参数支持

十、form-item

十一、progressBar

十二、wordCloud

十三、floatBall

十四、slide

1.参数支持

2.事件支持

3.样式参考

demo

代码

<template>
  <div id="app">
    <xj-button type="primary"
               @click="visible = true">按钮</xj-button>
    <xj-dialog title="提示"
               :visible.sync="visible"
               width="30%">
      <xj-form :model="model">
        <xj-form-item label="用户名">
          <xj-input placeholder="请输入用户名"
                    v-model="model.username"
                    clearable></xj-input>
        </xj-form-item>
        <xj-form-item label="密码">
          <xj-input placeholder="请输入密码"
                    type="password"
                    v-model="model.userpwd"
                    show-password></xj-input>
        </xj-form-item>
        <xj-form-item label="立即配送">
          <xj-switch v-model="model.soon"></xj-switch>
        </xj-form-item>
        <xj-form-item label="性别">
          <xj-radio-group v-model="model.gender">
            <xj-radio label="1">男</xj-radio>
            <xj-radio label="0">女</xj-radio>
          </xj-radio-group>
        </xj-form-item>
        <xj-form-item label="爱好">
          <xj-checkbox-group v-model="model.hobby">
            <xj-checkbox label="篮球">篮球</xj-checkbox>
            <xj-checkbox label="足球">足球</xj-checkbox>
            <xj-checkbox label="乒乓球">乒乓球</xj-checkbox>
          </xj-checkbox-group>
        </xj-form-item>
      </xj-form>
      <template v-slot:footer>
        <xj-button>取消</xj-button>
        <xj-button @click="btn"
                   type="primary">确定</xj-button>
      </template>
    </xj-dialog>
  </div>
</template>

<script>

export default {
  name: 'App',
  data () {
    return {
      model: {
        username: 'admin',
        userpwd: '123456',
        soon: true,
        gender: '1',
        hobby: ['篮球']
      },
      visible: false
    }
  }
}
</script>

效果