1.属性值绑定state里的数据,不用引号

class App extends Component {
constructor(props){
super(props);
this.state = {
title:"提示文字"
}
}
render() {
return (
<div>
{/* 属性值不用双引号 */}
<div title={this.state.title}>test</div>
</div>
);
}
}

2.class的绑定用className

  render() {
return (
<div>
{/* className绑定类名 */}
<div className="red">文字</div>
</div>
);
}

3.label中使用for的时候,要改成Htmlfor

  render() {
return (
<div>
{/* 使用htmlFor代替for */}
<label htmlFor="name">姓名:</label>
<input type="text" id="name"/>
</div>
);
}

4.绑定行内样式,绑定行内样式,需要两个大括号

class App extends Component{
render(){
return(
<div>
<div className="test" style={{"margin":"0 auto"}}> </div>
</div>
)
}
}

react属性绑定的更多相关文章

  1. React事件绑定的几种方式对比

    React事件绑定 由于类的方法默认不会绑定this,因此在调用的时候如果忘记绑定,this的值将会是undefined.通常如果不是直接调用,应该为方法绑定this.绑定方式有以下几种: 1. 在构 ...

  2. 【WPF】如何把一个枚举属性绑定到多个RadioButton

    一.说明 很多时候,我们要把一个枚举的属性的绑定到一组RadioButton上.大家都知道是使用IValueConverter来做,但到底怎么做才好? 而且多个RadioButton的Checked和 ...

  3. react 属性与状态 学习笔记

    知识点:1.react 属性的调用 this.props.被调用的属性名 设置属性的常用方法:var props = { one: '123', two: 321}调用这个属性:<HelloWo ...

  4. Knockoutjs实例 - 属性绑定(Bindings)之流程控制(Control flow)

    一.foreach binding 使用此功能可以方便我们循环遍历输出某个数组.集合中的内容. (1).循环遍历输出数组 View Row Code 1 <script type="t ...

  5. grootJs的属性绑定指令

    index6.html 绑定文本text gt-text="{属性名}" 绑定标签属性attr gt-attr="vm属性名称(标签属性,value表达式)" ...

  6. 控制文本和外观------Attr Binding(attr属性绑定)

    Attr Binding(attr属性绑定) 目的 attr 绑定提供了一种方式可以设置DOM元素的任何属性值.你可以设置img的src属性,连接的href属性.使用绑定,当模型属性改变的时候,它会自 ...

  7. javascript . 04 匿名函数、递归、回调函数、对象、基于对象的javascript、状态和行为、New、This、构造函数/自定义对象、属性绑定、进制转换

    匿名函数:   没有名字的函数,函数整体加小括号不报错, 函数调用 : a:直接调用 (function (){函数体}) ( ) ; b:事件绑定 document.onlick = functio ...

  8. angular 组件学习-组件内属性绑定

    #组件内的属性(元素的属性)绑定(property binding) 应用场景:通过改变DOM元素的属性,动态显示/隐藏一个元素 知识点:HTML 属性与DOM属性的区别 改变HTMl属性,浏览器需要 ...

  9. LiveBindings --- 把对象之间的属性绑定起来

    有了 FireMonkey 框架,它不同于 VCL ,以往的数据感知控件不能放在它上面,所以 XE2 提供了 LiveBindings 功能作为替代方案.另外它也是个通用的基础设施,同样可用于传统的V ...

随机推荐

  1. [剑指Offer]59-队列的最大值(题目二待补)

    题目一:滑动窗口的最大值 题目链接 https://www.nowcoder.com/practice/1624bc35a45c42c0bc17d17fa0cba788?tpId=13&tqI ...

  2. C++编译中的内存分配

    一个由 C/C++ 编译的程序占用的内存分为以下五个部分 代码区:存放CPU执行的机器指令,代码区是可共享,并且是只读的. 数据区:存放已初始化的全局变量.静态变量(全局和局部).常量数据. BBS区 ...

  3. f5 V11 TMSH命令行操作手册

    1.命令行登录工具:“SshClient.exe” 2.查看当前系统配置: # show running-config # show running-config net interface:网络接口 ...

  4. Android studio实现简单的CRUD

    1.打开Android studio ,创建项目DataBase01 2.进行UI设计,如图 目的:实现对姓名及其爱好的增删改查 3.创建DB.java,用于创建数据库,并做相关操作 在该目录下右键- ...

  5. RecyclerView的点击事件添加-------接口回调的形式添加

    package com.example.recyclerviewdemo; import android.support.v7.widget.RecyclerView; import android. ...

  6. 访问注解(annotation)的几种常见方法

    java的注解处理器类主要是AnnotatedElement接口的实现类实现,为位于java.lang.reflect包下.由下面的class源码可知AnnotatedElement接口是所有元素的父 ...

  7. EntityFramework的linq扩展where

    代码 using System; using System.Collections.Generic; using System.Linq; using System.Linq.Expressions; ...

  8. JS中判断某个字符串是否包含另一个字符串的五种方法

    String对象的方法 方法一: indexOf()   (推荐) ? 1 2 var str = "123" console.log(str.indexOf("2&qu ...

  9. 当时钟事件声明为过程变量 让system.threading.timer时钟失效

    这个项目的小模块就是画label 控件到tablepayoutpanel表单 之中, 中间用到了时钟,事件(带返回值的),哈希表 .由于时钟定义在 form1的启动构造函数中导致了form1,启动完毕 ...

  10. VS2013一次替换变量名

    插件下载地址:https://visualstudiogallery.msdn.microsoft.com/164904b2-3b47-417f-9b6b-fdd35757d194 该插件目前只支持: ...