mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-22 23:12:52 +02:00
Code Issues Releases Wiki Activity

use refs for div component instead findDOMNode (#708)

Browse Source
This commit is contained in:
Aliaksei Simanchyk
2017-04-03 19:30:20 +03:00
committed by Ian Storm Taylor
parent affb2eb56a
commit 7794ebe3be
1 changed files with 7 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/content.js
View File

@@ -4,7 +4,6 @@ import Debug from 'debug'
import Node from './node' import Node from './node'
import getPoint from '../utils/get-point' import getPoint from '../utils/get-point'
import React from 'react' import React from 'react'
import ReactDOM from 'react-dom'
import Selection from '../models/selection' import Selection from '../models/selection'
import getTransferData from '../utils/get-transfer-data' import getTransferData from '../utils/get-transfer-data'
import TYPES from '../constants/types' import TYPES from '../constants/types'
@@ -118,8 +117,7 @@ class Content extends React.Component {
this.updateSelection() this.updateSelection()
if (this.props.autoFocus) { if (this.props.autoFocus) {
const el = ReactDOM.findDOMNode(this) this.element.focus()
el.focus()
} }
} }
@@ -138,8 +136,7 @@ class Content extends React.Component {
updateSelection = () => { updateSelection = () => {
const { editor, state } = this.props const { editor, state } = this.props
const { document, selection } = state const { document, selection } = state
const el = ReactDOM.findDOMNode(this) const window = getWindow(this.element)
const window = getWindow(el)
const native = window.getSelection() const native = window.getSelection()
// If both selections are blurred, do nothing. // If both selections are blurred, do nothing.
@@ -148,9 +145,9 @@ class Content extends React.Component {
// If the selection has been blurred, but hasn't been updated in the DOM, // If the selection has been blurred, but hasn't been updated in the DOM,
// blur the DOM selection. // blur the DOM selection.
if (selection.isBlurred) { if (selection.isBlurred) {
if (!el.contains(native.anchorNode)) return if (!this.element.contains(native.anchorNode)) return
native.removeAllRanges() native.removeAllRanges()
el.blur() this.element.blur()
debug('updateSelection', { selection, native }) debug('updateSelection', { selection, native })
return return
} }
@@ -188,8 +185,8 @@ class Content extends React.Component {
return false return false
}) })
const anchorSpan = el.querySelector(`[data-offset-key="${anchorKey}-${anchorIndex}"]`) const anchorSpan = this.element.querySelector(`[data-offset-key="${anchorKey}-${anchorIndex}"]`)
const focusSpan = el.querySelector(`[data-offset-key="${focusKey}-${focusIndex}"]`) const focusSpan = this.element.querySelector(`[data-offset-key="${focusKey}-${focusIndex}"]`)
const anchorEl = findDeepestNode(anchorSpan) const anchorEl = findDeepestNode(anchorSpan)
const focusEl = findDeepestNode(focusSpan) const focusEl = findDeepestNode(focusSpan)
@@ -215,7 +212,7 @@ class Content extends React.Component {
setTimeout(() => { setTimeout(() => {
// COMPAT: In Firefox, it's not enough to create a range, you also need to // COMPAT: In Firefox, it's not enough to create a range, you also need to
// focus the contenteditable element too. (2016/11/16) // focus the contenteditable element too. (2016/11/16)
if (IS_FIREFOX) el.focus() if (IS_FIREFOX) this.element.focus()
this.tmp.isSelecting = false this.tmp.isSelecting = false
}) })