查看: 290|回复: 10

基础3 循环数据v-for 提交数据 绑定时间v-on list.push

[复制链接]
回帖奖励 20 MC币 回复本帖可获得 1 MC币奖励! 每人限 1 次(中奖概率 60%)

170

主题

178

帖子

787

积分

管理员

子枫

Rank: 9Rank: 9Rank: 9

积分
787
发表于 2020-3-24 11:31:28 | 显示全部楼层 |阅读模式
[AppleScript] 纯文本查看 复制代码
<!-- 
    循环数据v-for
    提交数据
    绑定时间v-on
    list.push
-->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    
</head>
<body>
   
    <div  id="app">
        <input type="text" v-model="inputValue" >
        <input type="button" value="提交" v-on:click="btnClick">

        <ul>
            <li v-for="item in list">{{item}}</li>
        </ul>
    </div>
    
</body>
</html>

<script>
    var app = new Vue({
        el:"#app",
        data: {
            list: ['第一课内容','第二课内容'],
            inputValue:''
        },
        methods: {
            btnClick: function() {
                // this.inputValue   //获取input数据
                this.list.push(this.inputValue)
                this.inputValue =''
            }
        }
    })
</script>

0

主题

17

帖子

4

积分

新手上路

Rank: 1

积分
4
发表于 2020-3-24 11:32:08 | 显示全部楼层
感谢
回复

使用道具 举报

0

主题

9

帖子

2

积分

新手上路

Rank: 1

积分
2
发表于 2020-3-24 11:36:33 | 显示全部楼层
感谢分享
回复

使用道具 举报

0

主题

11

帖子

7

积分

新手上路

Rank: 1

积分
7
发表于 2020-3-24 11:38:55 | 显示全部楼层
到此一游
回复

使用道具 举报

0

主题

7

帖子

3

积分

新手上路

Rank: 1

积分
3
发表于 2020-3-24 11:48:00 | 显示全部楼层
好东西一定要看看!
回复

使用道具 举报

0

主题

5

帖子

10

积分

新手上路

Rank: 1

积分
10
发表于 2020-3-24 11:48:19 | 显示全部楼层
到此一游
回复

使用道具 举报

0

主题

6

帖子

6

积分

新手上路

Rank: 1

积分
6
发表于 2020-3-24 14:31:57 | 显示全部楼层
谢谢您的分享!
回复

使用道具 举报

0

主题

15

帖子

10

积分

新手上路

Rank: 1

积分
10
发表于 2020-3-24 20:13:54 | 显示全部楼层
论坛有你更精彩!
回复

使用道具 举报

0

主题

10

帖子

4

积分

新手上路

Rank: 1

积分
4
发表于 2020-3-24 20:29:12 | 显示全部楼层
不错
回复

使用道具 举报

0

主题

11

帖子

2

积分

新手上路

Rank: 1

积分
2
发表于 2020-3-24 22:51:01 | 显示全部楼层
论坛有你更精彩!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则