[Vue] introduced third-party components (Layui)

About Vue way to introduce third-party components are many, many ways have been tested but not feasible. My demand is to introduce Layui the front-end framework in the project using Vue Scaffolding in two ways, first is to use npm import, the second copy Layui folder (js and css). On the first one way, I found a number of ways on Baidu, but the question cited undefined components are present. Here I record the second way possible. Also, I think the second way is more flexible, because the components can be modified to meet the demand.

1. In Layui official website to download the file

Layui official website

2. Under static copy it to Vue project directory

3. Introduced in the index.html

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

4. In the VUE files require the introduction of

<script src="./../static/layui/layui.js"></script>
<script>
export default {
  name: 'UserList',
  mounted () {
    layui.use('form', function () {
      var form = layui.form
      // 监听提交
      form.on('submit(formDemo)', function (data) {
        layer.msg(JSON.stringify(data.field))
        return false
      })
    })
  }
}
</script>