1.1.3 • Published 2 years ago

yll-qfui v1.1.3

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

###安装

cnpm i yll-ui -S

###使用

配置  在main.js
import ElementUI from 'yll-ui'
import 'yll-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

###组件多选框

<template>
  <el-checkbox-group v-model="checkList">
    <el-checkbox label="复选框 A"></el-checkbox>
    <el-checkbox label="复选框 B"></el-checkbox>
    <el-checkbox label="复选框 C"></el-checkbox>
    <el-checkbox label="禁用" disabled></el-checkbox>
    <el-checkbox label="选中且禁用" disabled></el-checkbox>
  </el-checkbox-group>
</template>
<script>
export default {
  data() {
    return {
      checkList: ["选中且禁用", "复选框 A"],
    };
  },
};

###Switch 开关

<el-switch
  v-model="value"
  active-color="#13ce66"
  inactive-color="#ff4949">
</el-switch>
<script>
export default {
  data() {
    return {
      value: true,
    };
  },
};
</script>

###组件框框

<template>
    <fieldset>
        <legend>{{title}}</legend>
        <slot></slot>
    </fieldset>
</template>
<script>
export default {
  name: "qfui-kuangkuang",
  props: {
    title: {
      type: String,
    },
  },
};

###组件分页

<template>
    <div class="page">
        <span v-for="n in total" v-bind:key="n" @click="changePageFn(n)">
            {{n}}
        </span>
    </div>
</template>
<script>
export default {
  name: "qfui-page",
  props: {
    total: {
      type: Number,
    },
  },

  methods: {
    changePageFn(n) {
      this.$emit("changePageFn", n);
    },
  },
};
</script>
1.1.3

2 years ago

1.0.3

2 years ago

1.0.1

2 years ago