【Vue】引入第三方組件（Layui）

關於Vue引入第三方組件的方式有很多，但測試過很多方式都不可行。我的需求是在使用Vue腳手架搭建的項目中引入Layui這個前端框架，方式有兩種，第一種是使用npm導入，第二種拷貝Layui文件夾（js和css）。關於第一種方式，我在百度上找了很多種方法，但是都出現引用組件未定義的問題。在此我記錄下可行的第二種方式。另外，我覺得第二種方式比較靈活，因爲可以對組件進行修改來滿足需求。

1. 在Layui官網下載文件

Layui官網

2. 將其複製到Vue項目的static目錄下

3. 在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. 在需要使用的VUE文件中引入

<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>