zoukankan      html  css  js  c++  java
  • angular,vue,react的基本语法—插值表达式,渲染数据,响应式数据

    基本语法:

    1、插值表达式:

    vue:{{}}

    react:{}

    angular:{{}}

    2、渲染数据

    vue

    js:
    export default{
      data(){
        return{
        msg:"我是数据"
            }
        }  
    }
    
    html:
    <p>{{msg}}</p>

    react

    js:
    this.state={
      msg:"我是数据"  
    }
    
    html:
    <p>{this.state.msg}</p>

    angular

    ts:
    export class AppComponent{
        msg='我是数据';
    }
    
    html:
    <p>{{msg}}<p>

    3、响应式数据

    vue

    js:
    export default{
      data(){
        return{
        msg:"我是数据"
            }
        }  
    }
    
    html:
    <p>{{msg}}<p>

    //更改:
    handlechange(){
      this.msg="响应一下";
    }

     react

    js:
    this.state={
      msg:"我是数据"  
    }
    
    html:
    <p>{this.state.msg}</p>
    
    //更改
    
    this.setState({
        msg:"响应一下"
    })

    angular

    ts:
    export class AppComponent{
        msg='我是数据';
    }
    
    html:
    <p>{{msg}}<p>
    
    //更改
    
    export class AppComponent{
        construtor(){
            setTimeout(()=>{
               this.msg="响应一下"; 
            },2000)
        }
    }    
  • 相关阅读:
    [HAOI2008]糖果传递
    LGTB 与大数
    LGTB 与序列
    poj1160 Post Office
    组队
    [JLOI2015]装备购买
    三元组
    乘法表
    [BZOJ3730]震波
    [Luogu3345][ZJOI2015]幻想乡战略游戏
  • 原文地址:https://www.cnblogs.com/xiaojianwei/p/10072901.html
Copyright © 2011-2022 走看看