huzidaha / react-naive-book Goto Github PK
View Code? Open in Web Editor NEW开源、免费、专业、简单的 React.js 在线教程
Home Page: http://huziketang.com/books/react
开源、免费、专业、简单的 React.js 在线教程
Home Page: http://huziketang.com/books/react
在加入 createdTime 那一版的css中
.comment-createdtime {
padding-right: 5px;
position: absolute;
bottom: 0;
right: 0;
padding: 5px;
font-size: 12px;
}
padding-right
属性多余了 :)
如题:
想问一下,教程的图是用什么工具作成的,谢谢大哈
朋友推荐的,说写的非常好。但是不知道为何,访问非常慢。。。
现在链接地址 显示的不是react小书的地址~ @huzidaha
<p dangerouslySetInnerHTML={{ __html: this._getProcessedContent(comment.content) }} />
这段应该报错,应改成
<p dangerouslySetInnerHTML={{ __html: this._getProcessedContent(this.props.comment.content) }} />
教程非常棒,感谢大哈。
Thank you.
总计中写道:
总结
我们一般会把组件的 state 的初始化工作放在 constructor 里面去做;在 componentWillMount 进行组件的启动工作,例如 Ajax 数据拉取、定时器的启动;组件从页面上销毁的时候,有时候需要一些数据的清理,例如定时器的清理,就会放在 componentWillUnmount 里面去做。
也就是说,推荐在 componentWillMount 的时候进行数据请求。我在翻 react 文档的时候发现,上面是这么写的:
componentDidMount()
componentDidMount() is invoked immediately after a component is mounted. Initialization that requires DOM nodes should go here. If you need to load data from a remote endpoint, this is a good place to instantiate the network request. Setting state in this method will trigger a re-rendering.
文档上说应该在 componentDidMount 阶段进行网络请求的实例化,那请问最好的进行网络请求的地方是在哪里?
看了您的文章受益匪浅。想请教一下:在项目中使用了redux,知道智能组件和展示组件的区别。可不可以在智能组件中使用react原始的this.state来控制自身内容展示和隐藏。即操作this.setState()的方法。
http://huziketang.com/ 域名到期了,无法访问
邮箱:[email protected]
知乎:@胡子大哈
专栏:@前端大哈
加入《React.js 小书》读者交流群,一起讨论、交流、学习前端技术。
_上面提到交流群号是多少?_谢谢~~
以为是群友们的性质?可图片是你个人微信号,所以没有好意思加。呵呵!
如果对 react 源码感兴趣的朋友,欢迎一起共建。如果有什么好的外文需要翻译,也可以加到 仓库read.me 中的TODO列表。或者觉得什么文章好,也欢迎提 PR 收录进来。希望能一起对文章质量把关,一起共建社区最好的 react 源码生态环境
Hello,everyone:
Lesson 29关于context的用法,最新的16.4.1版本react已经不使用this.context了,但是还是支持老的用法,后续版本就不会再支持this.context了。
最新的方法详见:https://reactjs.org/docs/context.html
举个例子:
比如component结构如下,App包含Child1,Child1包含Child2,Child2包含Child3.
现在需要把App里面传一个值red(注意是red不是blue)到Child3里面的button里面去:
1.首先在App里面要
export const ButtonColor=React.createContext(‘blue')
来创建这个context, blue是一个默认值,如果咱们没有写provider的话,默认就把blue传给 child component了,但是一般咱们都会写provider,所以blue在这里可写可不写,其实不写挺好的,省事。
2.在App render里面的return用
<ButtonColor.Provider value='red'> <Child1 /> </ButtonColor.Provider>
把Child1包裹住,此时说明了ButtonColor.Provider是一个provider了,提供的东西是red,这里打算把red传给child1 component以及他的child component,所以child 3也能接收这个value。
3.在Child3这个component里面首先要先
import {ButtonColor} from App.js
,
然后用ButtonColor.Consumer包裹某个东西,这个东西必须是一个function,或者用箭头函数写更好.
<ButtonColor.Consumer> {value=>( <button style={{backgroundColor:value}}></button> )} </ButtonColor.Consumer>
这样就成功的把red 从app里面传到了child3的button里面了.当然咱们如果想要传个function什么都行,反正就是能隔着好几个component传东西,不过context肯定是不能替换redux的,毕竟功能太单一了。
如果有写错的地方,希望大神们指出来,欢迎大家指出来,共同进步,谢谢。
Regards
Ming
RT,有了react生命周期,redux,还差一个路由的概念就完整了。
在render()函数中直接返回字符串会报undefined的错误,应该用一个变量存起来。
网站貌似无法打开了
可否提供PDF版本?或者epub版本,可以离线学习?
尝试编译,缺少database file。感谢!
感觉这React小书写得超级棒,很好的入门书籍,但想问下大佬,后续还会更新技术点吗
#router
#redux-saga
感谢作者的教程,学起来很愉快。只是教程里评论总提示请文明用语。。。
学习lesson24这节的时候发现会有propTypes 的warning,查询后发现15.5后已经独立出来了
// After (15.5)
`import React from 'react';
import PropTypes from 'prop-types';
class Component extends React.Component {
render() {
return
Component.propTypes = {
text: PropTypes.string.isRequired,
};`
参考:https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html#migrating-from-react.proptypes
链接打开全都404了
https拒绝,http可用
http://huziketang.mangojuice.top/books/react/lesson39 中,mapStateToProps和mapDispatchToProps是否少了第二个参数this.props?
文本过长会超出显示框,建议添加p标签添加自动换行 word-break:break-word;
为什么不用 textarea 的 autofocus 属性啊?
不是说尽量不用 ref 吗
您好,感谢您的教程
在章节 挂载阶段的组件生命周期(二)中,
class Index extends Component {
constructor () {
super()
this.state = { isShowClock: true }
}
handleShowOrHide () {
this.setState({
isShowClock: !this.state.isShowClock
})
}
第一行Component
前面应该加上 “Reacr.”
博主的像是React Native 的写法。
另外有两个问题想请教下博主:
1、这种.md文档是如何做出在线书籍的?(以您这本书为例,阮一峰老师的ES6教程似乎也是如此)
2、文中的做图软件是什么?
谢谢了。
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.