vue的Template三种写法
一、选项模板：在构造器中用··写二、Template标签模板：在body中写template标签，然后通过id在构造器中绑定三、script标签模板：在script标签中写，值得注意的是，此时的type=“x-template” ，也是通过id在构造器中绑定，可以通过src来引用外部文件，使代码简洁。<!DOCTYPE html><html lang="en"><he
·
一、选项模板：在构造器中用··写
二、Template标签模板：在body中写template标签，然后通过id在构造器中绑定
三、script标签模板：在script标签中写，值得注意的是，此时的type=“x-template” ，也是通过id在构造器中绑定，可以通过src来引用外部文件，使代码简洁。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
<h1>Template三种写法</h1>
<hr>
<div id="app">
{{message}}
</div>
<template id="dd2">
<h2 style="color:red">我是Template标签模板<h2>//法二
</template>
<script type="x-template" id="dd3" src="">
<!-- src引用外部文件 法三 -->
<h2 style="color:red">我是script标签模板<h2>
</script>
<script>
var app = new Vue({
el:'#app',
data:{
message:'hellow word!11'
},
template:`
<h2 style="color:red">我是选项模板<h2>
`,//法一
template:'#dd3',
})
</script>
</body>
</html>
魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。
更多推荐
4
0- 0
已为社区贡献1条内容
所有评论(0)