1,首先在官网下载对应的文件;
下载链接:https://www.layui.com/
当然你也可以常识其他的方式:这里有链接,可以自行尝试:https://www.layui.com/doc/

vue项目中使用layUI

2,把解压后的文件放到static目录中

vue项目中使用layUI 

3,在html入口也引入相应的文件。

vue项目中使用layUI

 <link type="text/css" rel="stylesheet" href="./static/layui/css/layui.css"/>
 <script type="text/javascript" src="./static/layui/layui.js"></script>

4:组件内的使用情况:

<template>
    <div>
      <ul class="layui-nav" lay-filter="">
        <li class="layui-nav-item"><a href="">最新活动</a></li>
        <li class="layui-nav-item layui-this"><a href="">产品</a></li>
        <li class="layui-nav-item"><a href="">大数据</a></li>
        <li class="layui-nav-item">
          <a href="javascript:;">解决方案</a>
          <dl class="layui-nav-child"> <!-- 二级菜单 -->
            <dd><a href="">移动模块</a></dd>
            <dd><a href="">后台模版</a></dd>
            <dd><a href="">电商平台</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item"><a href="">社区</a></li>
      </ul>
    </div>
</template>

<script>

    export default {
        name: "nav",
      mounted(){
        layui.use('element', function(){
          var element = layui.element
        })
      },
      methods: {}
    }
</script>
<style scoped>
</style>

5:成功

vue项目中使用layUI

相关文章:

  • 2021-11-19
  • 2021-11-12
  • 2021-10-06
  • 2020-04-21
  • 2019-12-16
  • 2021-11-01
  • 2018-09-25
  • 2021-09-10
猜你喜欢
  • 2020-06-02
  • 2019-03-21
  • 2021-08-30
  • 2021-08-03
  • 2019-09-27
  • 2019-12-23
  • 2021-08-30
  • 2021-08-06
相关资源
相似解决方案