layui vue

<template>
  <div>
    <!-- 使用 Layui Vue 的按钮组件 -->
    <lay-button type="primary">主要按钮</lay-button>
    <lay-button type="success">成功按钮</lay-button>
    <lay-button type="warning">警告按钮</lay-button>
    <lay-button type="danger">危险按钮</lay-button>
  </div>
</template>

<script>
import { defineComponent } from 'vue';
import { LayButton } from 'layui-vue'; // 引入 Layui Vue 的按钮组件

export default defineComponent({
  components: {
    LayButton, // 注册按钮组件
  },
});
</script>

<style scoped>
/* 可以在这里添加自定义样式 */
</style>

解释说明：

1. 模板部分 (<template>):

   • 使用了 Layui Vue 提供的 lay-button 组件来创建不同类型的按钮（主要、成功、警告、危险）。

2. 脚本部分 (<script>):

   • 使用 defineComponent 定义一个 Vue 组件。
   • 通过 import 引入 Layui Vue 的按钮组件 LayButton。
   • 在 components 中注册 LayButton，以便在模板中使用。

3. 样式部分 (<style scoped>):

   • 可以添加一些自定义样式，作用范围仅限于当前组件。