在django或flask带的jinja2模版中使用vue和element-ui

1，head标签中加上：

    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.15.1/index.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.15.1/theme-chalk/index.min.css"  rel="stylesheet">

2，在需要用的地方加上id，使用[[]]包上变量，可同时使用jiaja2变量：

    <div id="app">
        <el-button @click="toggleSelection">[[name]]</el-button>
    </div>

3，js里面构造实例vm：

var vm = new Vue({
el: '#app',
  delimiters:['[[', ']]'],
  methods: {
      toggleSelection() {
          alert("hahaha")
      }
    },
    data: {
        name: '可爱的按钮'
    }
})

 // 在后面的逻辑中可更改data，如 vm.name = 999
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容