reactjs学习笔记1

来源:互联网 发布:linux应用领域 编辑:程序博客网 时间:2024/05/20 00:12

./表示当前路径

../表示上一个路径

script标签上面的type是text/jsx

jsx的特点就是在js里写html

<script type="text/jsx">
    var HelloWorld = React.createClass({
    render: function () {
    return <p>Hello, World</p>
    }
    });
    React.render(<HelloWorld></HelloWorld>, document.body);
    </script>

这段代码就是说定义了一个组件叫做HelloWorld,return 一个带有helloworld内容的p标签。React.createClass就是定义一个组件的方法。

利用React.render实际渲染出一个组件,第一个对象是一个字符串,第二个是组件放置的地方。


组件的命名要大写。否则在渲染的时候会出错,如果是小写的话,会被当作是固有的dom元素。

Jsx将项目的代码完成了不同于mvc模式的模块化,是指将一个一个部分分离开,样式和逻辑混在一起。


如果要在jsx中使用html和class要使用替代品,也就是htmlFor和className

在jsx中使用css时要注意style里面的要用驼峰式命名法。


在写列表组件的时候最好给每一个元素一个key属性。

dangerouslysetinnerHtml这个是动态写入的html代码,也就是用户输入,是有xss跨站攻击风险的。

ref是父组件对子组件的引用。


一个组件内的key是不能相同的,而不同组件之间可以有相同的key

相似的组件最好编写成一个组件,列表类的组件最好给每一个项目加上一个Key,能够避免很多性能问题。

如果很多子项目都有相同的key,只会能保留第一个。


对于一个实例来说,绝大多数的时间都用在了运行中这个状态里。、

在初始化的状态中,第二个阶段,也就是getinitialstate必须返回一个对象或者null

运行中的状态就是说它已经被渲染生成出来,然后通过父组件对它的状态进行了修改,这个时候发生的状态改变。

0 0