uni-app数据绑定

姚海涛

之前接触前端，数据绑定这块要么用组件，要么用jq去操作dom

uni-app数据绑定分两种情况

在标签内部绑定使用：{{参数}}

标签内部绑定使用： 例：:value='参数' 也就是标签内属性绑定参数要多加个：

当前绑定的前提基于该参数存在

在每个.vue的页面中都有配置数据的地方：

<script>
    export default {
        data() {
            return {
                UserName: 'admin'
            }
        },
        methods: {
            
        }
    }
</script>

data(){}就是放数据的地方

只要在data(){}中return了，都可以按照上面两种方法去绑定数据

部分情况也存在要绑定的数据是个数组，这个时候就需要循环绑定了

<template>
    <view class="content">
        <view v-for="(stu,index) in student" :key='index'>
            姓名:{{stu.name}},年龄{{stu.age}}
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                student: [
                    {
                        name:'张三',
                        age:10
                    },
                    {
                        name:'李四',
                        age:10
                    },
                    {
                        name:'王五',
                        age:10
                    },
                ]
            }
        },
        methods: {

        }
    }
</script>

可以看到循环用 v-for，后面有用到一个 :key,是为了保证循环的每项的唯一性

来源：https://www.cnblogs.com/getmn/p/11030204.html