在vue中使用pug

1. 声明pug语言

在 .vue 文件中,使用 <template lang="pug"> ... </template> 声明pug模板。

2. 书写属性及文本

  1. 在 .vue 文件中,使用 tagname.className(attributeName="attributeValue") textContent格式书写。
    举例: div.test(:data="data-var") {{ data.text}}

  2. 注意:圆括号前没有空格,圆括号后面有空格

  3. 如果有多个attribute,可以分行写或者用逗号隔开。
    举例:

    // 分行
    slot(:msg="msg"
      class="hahah")

或者

    // 一行
    slot(:msg="msg" class="hahah")

或者

    // 使用逗号
    slot(:msg="msg", class="hahah")
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,072评论 0 29
  • # 传智播客vue 学习## 1. 什么是 Vue.js* Vue 开发手机 APP 需要借助于 Weex* Vu...
    再见天才阅读 3,589评论 0 6
  • Vue 实例 属性和方法 每个 Vue 实例都会代理其 data 对象里所有的属性:var data = { a:...
    云之外阅读 2,233评论 0 6
  • 苦苦的挣扎,拼命的闯,奈何还是一无所有!人生有时候靠赌,压上了所有的赌注,输赢听天由命,或许还没有到最后一刻的时候...
    亦凝心娜阅读 306评论 0 0
  • 2016年4月14日星期四 1.百度宣布业务架构重组,成立“百度搜索公司”。新浪科技4月13日下午消息,百度公司董...
    简小兮阅读 269评论 0 1