vue模板语法插值Mastache

[复制链接]
发表于 4 天前 | 显示全部楼层 |阅读模式

image.png

image.png

image.png

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <title>mastache</title>
</head>
<body>
<div id="app">
    {{text}}<br/>
//支持动态赋值
    <span v-html="text"></span>
    <a v-bind:href="url">程序思维</a><br/>//
//还支持javaScript表达式
    {{url.toUpperCase()}}<br/>
    {{a+b}}<br/>
    {{isShow?'显示':'隐藏'}}
</div>
<script src="js/vue.js"></script>
<script>
    new Vue({
        el:"#app",
        data(){
            return{
                text:"<span style='color:#FF0000'>大家好</span>",
                url:"http://www.lucklnk.com",
                a:1,
                b:2,
                isShow:false
            }
        }
    })
</script>
</body>
</html>

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

×

GMT+8, 2025-4-20 17:40 , Processed in 0.069722 second(s), 36 queries Archiver|手机版|小黑屋|Attic ( 京ICP备2020048627号 )

快速回复 返回顶部 返回列表