网站专题BANNER

gulp-file-include 基础语法

发表日期:2020-07-14 20:03:19 文章编辑:洛壹网络 文章来源:网站开发注意事项

1.基础模块调用

1
@@include("./include/module.html")


2.带参模块调用 /* 参数必须使用双引号 */

1
2
3
@@include("./include/module.html", {
    "index""active"
})


3.文本变量

1
2
3
4
5
6
7
//模块
<div>@@variate</div>
 
//调用
@@include("./include/module.html", {
    "variate""true"
})


4.URL变量

1
2
3
4
5
6
7
//模块
<a href="@@url">我是一个链接</a>
 
//调用
@@include("./include/module.html", {
    "url""www.baidu.com"
})


5.if语句(外部)

1
2
3
4
5
6
7
8
9
//模块
@@if (context.flag) {
    <div>我是一个模块</div>
}
 
//调用
@@include("./include/module.html", {
    "flag""true"
})


6.if语句(内部)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//模块
<div class="@@if(context.flag) {active}">我是一个模块</div>
 
//调用
@@include("./include/module.html", {
    "flag""true"
})
 
 
//模块
<div @@if (context.flag === 'true') {class='active'}>我是一个模块</div>
 
//调用
@@include("./include/module.html", {
    "flag""true"
})


7.for语句(基础)

1
2
3
4
5
6
7
//模块
@@for(var i = 0; i < 4; i++) {
    <div class="item">我是一个item</div>
}
 
//调用
@@include("./include/module.html")


8.for语句(进阶)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
//模块
@@for(var i = 0; i < context.length; i++) {
    <a href="`+context.arr[i].url+`" class="item `+(i == 0 ? 'active' : '')+`">`+context.arr[i].text+`</a>
}
 
//调用
@@include("./include/module.html", {
    "length""4",
    "arr": [
        {
            "text""111",
            "url""111"
        },
        {
            "text""222",
            "url""222"
        },
        {
            "text""333",
            "url""333"
        },
        {
            "text""444",
            "url""444"
        }
    ]
})


相关内容
我们
定制
咨询
联系
在线咨询
您的浏览器版本太低

请升级您的浏览器: Internet Explorer11 或以下浏览器: Firefox  /  Chrome  /  360极速浏览器