胡子大哈
huziketang.com/books/react…
- class Component {
- setState (state) {
- const oldEl = this.el
- this.state = state
- this.el = this._renderDOM()
- if (this.onStateChange) this.onStateChange(oldEl, this.el)
- }
- _renderDOM () {
- this.el = createDOMFromString(this.render())
- if (this.onClick) {
- this.el.addEventListener('click', this.onClick.bind(this), false)
- }
- return this.el
- }
- }
- const mount = (component, wrapper) => {
- wrapper.appendChild(component.renderDOM())
- component.onStateChange = (oldEl, newEl) => {
- wrapper.insertBefore(newEl, oldEl)
- wrapper.removeChild(oldEl)
- }
- }
- class
- LikeButton
- extends
- Component
- {
- constructor () {
- this.state = { isLiked: false }
- }
- onClick () {
- this.setState({
- isLiked: !this.state.isLiked
- })
- }
- render () {
- return `
- <button class='like-btn'>
- <span class='like-text'>${this.state.isLiked ? '取消' : '点赞'}</span>
- <span>
来源: https://juejin.im/post/5a050f1e518825619a022536