Getting Started – Pug https://pugjs.org/api/getting-started.html

GitHub - Tencent/wepy: 小程序组件化开发框架 https://github.com/Tencent/wepy

<template lang="pug">
view(class='container')
view(class='userinfo' @tap='tap')
mycom(:prop.sync='myprop' @fn.user='myevent')
text {{now}}
</template> 多会企业版 - 专属线下活动平台 https://www.duohui.cn/enterprise#features Attributes – Pug https://pugjs.org/language/attributes.html

Here are some alternatives you can use to include variables in your attribute:

  1. Simply write the attribute in JavaScript:

     
    - var url = 'pug-test.html';
    a(href='/' + url) Link
    |
    |
    - url = 'https://example.com/'
    a(href=url) Another link
     
     
    <a href="/pug-test.html">Link</a>
    <a href="https://example.com/">Another link</a>
     
  2. If your JavaScript runtime supports ES2015 template strings (including Node.js/io.js 1.0.0 and later), you can also use its syntax to simplify your attributes:

     
    - var btnType = 'info'
    - var btnSize = 'lg'
    button(type='button' class='btn btn-' + btnType + ' btn-' + btnSize)
    |
    |
    button(type='button' class=`btn btn-${btnType} bt
    

    Style Attributes

    The style attribute can be a string, like any normal attribute; but it can also be an object, which is handy when styles are generated by JavaScript.

     
    a(style={color: 'red', background: 'green'})
     
    <a style="color:red;background:green;"></a>
     

pug.compile() will compile the Pug source code into a JavaScript function that takes a data object (called “locals”) as an argument.的更多相关文章

  1. How to compile and install Snort from source code on Ubuntu

    http://www.tuicool.com/articles/v6j2Ab Snort is by far the most popular open-source network intrusio ...

  2. XML.ObjTree -- XML source code from/to JavaScript object like E4X

    转载于:http://www.kawa.net/works/js/xml/objtree-try-e.html // ========================================= ...

  3. How to Build MySQL from Source Code on Windows & compile MySQL on win7+vs2010

    Not counting obtaining the source code, and once you have the prerequisites satisfied, [Windows] use ...

  4. How to compile and install Linux Kernel 5.1.2 from source code

    How to compile and install Linux Kernel 5.1.2 from source code Compiling a custom kernel has its adv ...

  5. Indenting source code

    Artistic Style 1.15.3 A Free , Fast and Small Automatic Formatterfor C , C++ , C# , Java Source Code ...

  6. [转]Native Java Bytecode Debugging without Source Code

    link from:http://www.crowdstrike.com/blog/native-java-bytecode-debugging-without-source-code/index.h ...

  7. UI5 Source code map机制的细节介绍

    在我的博客A debugging issue caused by source code mapping里我介绍了在我做SAP C4C开发时遇到的一个曾经困扰我很久的问题,最后结论是这个问题由于Jav ...

  8. Tips for newbie to read source code

    This post is first posted on my WeChat public account: GeekArtT Reading source code is always one bi ...

  9. 编程等宽字体Source Code Pro(转)

    Source Code Pro - 最佳的免费编程字体之一!来自 Adobe 公司的开源等宽字体下载     每一位程序员都有一套自己喜爱的代码编辑器与编程字体,譬如我们之前就推荐过一款"神 ...

随机推荐

  1. unity, read text file

    using System.IO; //test read txt        //Resources.Load(...) loads an asset stored at path in a Res ...

  2. CentOS下yum常用命令

    1.自动搜索最快镜像插件:yum install yum-fastestmirror 2.更换163的源. 首先:备份/etc/yum.repos.d/CentOS-Base.repomv /etc/ ...

  3. vivado error [Labtools 27-2149]

    使用vivado2014.3时遇到了这种错误 ERROR: [Labtools 27-2149] File E:/project/V7_PCIE/prj/PhasedProject/M_PcieGen ...

  4. boost thread

    #include <cassert> #include <iostream> #include <boost/ref.hpp> #include <boost ...

  5. c3p0 一个数据库链接的例子

    首先需要准备三个依赖包 c3p0-0.9.5.2.jar.mchange-commons-java-0.2.11.jar.mysql-connector-java-5.1.47.jar 下载链接 ht ...

  6. html-文本处理

    文本处理-相关操作: <!-- 申明为html5版本 --> <!DOCTYPE html> <html> <head> <title>文本 ...

  7. Java - web.xml文件中可以配置哪些内容?

    web.xml用于配置Web应用的相关信息,如:监听器(listener).过滤器(filter).Servlet.相关参数.会话超时时间.安全验证方式.错误页面等,下面是一些开发中常见的配置: ①配 ...

  8. 浅谈P2P终结者原理及其突破

    P2P终结者按正常来说是个很好的网管软件,但是好多人却拿它来,恶意的限制他人的流量,使他人不能正常上网,下面我们就他的功能以及原理还有突破方法做个详细的介绍! 我们先来看看来自在网上PSP的资料:P2 ...

  9. JavaScript函数内部修改全局变量的问题【一道面试题】

    JavaScript函数内部修改全局变量的问题 今天 10:44梵天莲华 | 浏览 23 次  Javascript编程语言函数 修改标签 代码如下,为什么加了 function a(){};这个函数 ...

  10. What is Web Application Architecture? How It Works, Trends, Best Practices and More

    At Stackify, we understand the amount of effort that goes into creating great applications. That’s w ...