uni-app学习--------数据绑定和样式绑定（第一天）

数据绑定：

1. {{text}} == return中的text 输出-》<p>测试数据tab12<p>
2.v-text="text" == return中的text。输出-》<p>测试数据tab12<p>
3. v-html="text" == return 中text 与，v-text不同是会解析html，输出-》测试数据tab12
4.直接输出<view class="">测试数据tab12</view>

样式绑定：
1.通过class="text1" 绑定。在style中写出相应的样式.text1{}
2.通过直接在view中绑定。<view class="" style="font-size: 33px;">
3.通过v-bind:style="style1"。然后在数据中绑定 style1:"font-size: 42px",其中v-bind可以简写为:style="style1"
4.通过在class前面加：，:class="style2"。相当于绑定样式，然后在style2中绑定<style>中text2样式
例子

<template>
    <view>
        测试数据tab12
        <view class="text1" v-text="text">
        </view>
        <view class="" v-html="text">
        </view>
        <view class="text1" v-text="text1" style="font-size: 33px;">
        </view> 
        <view class="" v-html="text1" v-bind:style="style1"></view> 
           //这个和上面那个相同
          <view class="" v-html="text1" style="style1"> </view> 
           <view :class="style2"  v-html="text1" >
        </view>
    </view>
</template>
<script>
    export default {
        data() {
            return {
                text:'<p>测试数据tab12<p>'
                text1:'<p>测试数据tab12<p>',
                style1:"font-size: 42px"
                style2:"text2"  
            }
        },
        methods: {
        }
    }
</script>
<style>
.text1{font-size: 22px; color: #007AFF;}
.text2{font-size: 22px; color:red}
</style>