vue的条件与循环练习 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
    <li v-for="todo in todos">
        <p v-if="seen">
            {{ message }}
        </p>
    </li>
</div>

<script src="demo.js"></script>
</body>
</html>

html文件

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!',
        seen: true,
        todos: [
            1,
            2,
            3
        ]
    }
})

js文件

在浏览器打开Html文件显示3个Hello Vue!

 

posted @ 2019-08-14 15:20  曹毅  阅读(137)  评论(0)  编辑  收藏  举报