mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-30 10:29:48 +02:00
Code Issues Releases Wiki Activity

Replace useMemo with useState in the docs (#5022)

Browse Source 
* Replace useMemo with useState

* Fix formatting
This commit is contained in:
Gabin Aureche
2022-06-11 16:58:19 +02:00
committed by GitHub
parent 9ae372875d
commit 22308b3417
10 changed files with 28 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
docs/walkthroughs/01-installing-slate.md
View File

@@ -18,7 +18,7 @@ Once you've installed Slate, you'll need to import it.
```jsx
// Import React dependencies.
import React, { useMemo } from 'react'
import React, { useState } from 'react'
// Import the Slate editor factory.
import { createEditor } from 'slate'
@@ -40,7 +40,7 @@ The next step is to create a new `Editor` object. We want the editor to be stabl
```jsx
const App = () => {
// Create a Slate editor object that won't change across renders.
const editor = useMemo(() => withReact(createEditor()), [])
const editor = useState(() => withReact(createEditor()))
return null
}
```
@@ -74,7 +74,7 @@ The provider component keeps track of your Slate editor, its plugins, its value,
const initialValue = []
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
// Render the Slate context.
return <Slate editor={editor} value={initialValue} />
}
@@ -94,7 +94,7 @@ Okay, so the next step is to render the `<Editable>` component itself:
const initialValue = []
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
// Add the editable component inside the context.
<Slate editor={editor} value={initialValue}>
@@ -120,7 +120,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>

6
docs/walkthroughs/02-adding-event-handlers.md
View File

@@ -17,7 +17,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>
@@ -38,7 +38,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>
@@ -68,7 +68,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>

8
docs/walkthroughs/03-defining-custom-elements.md
View File

@@ -15,7 +15,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>
@@ -74,7 +74,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
// Define a rendering function based on the element passed to `props`. We use
// `useCallback` here to memoize the function for subsequent renders.
@@ -130,7 +130,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {
@@ -188,7 +188,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {

6
docs/walkthroughs/04-applying-custom-formatting.md
View File

@@ -24,7 +24,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>
@@ -60,7 +60,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {
@@ -146,7 +146,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {

6
docs/walkthroughs/05-executing-commands.md
View File

@@ -19,7 +19,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {
@@ -126,7 +126,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {
@@ -183,7 +183,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
const renderElement = useCallback(props => {
switch (props.element.type) {

8
docs/walkthroughs/06-saving-to-a-database.md
View File

@@ -15,7 +15,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate editor={editor} value={initialValue}>
@@ -40,7 +40,7 @@ const initialValue = [
]
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
return (
<Slate
@@ -69,7 +69,7 @@ But... if you refresh the page, everything is still reset. That's because we nee
```jsx
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
// Update the initial content to be pulled from Local Storage if it exists.
const initialValue = useMemo(
() =>
@@ -135,7 +135,7 @@ const deserialize = string => {
}
const App = () => {
const editor = useMemo(() => withReact(createEditor()), [])
const [editor] = useState(() => withReact(createEditor()))
// Use our deserializing function to read the data from Local Storage.
const initialValue = useMemo(
deserialize(localStorage.getItem('content')) || '',