第一次在js文件中书写vue文件
- 话不多说 上代码：
js代码
//书写html代码
// document.write("<h1>123</h1>");
// 单行用 '' 多行用 ''和+ 或者 `` 两个方法
var tam = {
template:`<div class="card">
<div class="card-header">
<a class="collapsed card-link" data-toggle="collapse" href="#collapsesix">
Saturday
</a>
</div>
<div id="collapsesix" class="collapse" data-parent="#accordion">
<div class="card-body" id="card-body_1">
<a href="#card_6">my first Saturday</a>
</div>
</div>
</div>`
}
var app = new Vue({
el: "#app_1",
components: {
tan:tam,
},
data: {
}
});
html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="app_1">
<!-- 在引入的组件下方引入组件文件 否则显示不出来 -->
<tan></tan>
<script src="测试分文件写vue组件.js" type="text/javascript" charset="utf-8"></script>
</div>
</body>
</html>
运行结果
