[英]TypeError: Cannot read property 'length' of undefined in react.js
this is the error i'm getting in my react application.这是我在我的反应应用程序中遇到的错误。 please help me fix this.
请帮我解决这个问题。 I've extended the code for better understanding.
我已经扩展了代码以便更好地理解。 Have any idea what's the problem
有什么问题
const TextEditor = (value, props) => {
console.log(props.value)
console.log(props.value.length)
const renderElement = useCallback(props => <Element {...props} />, [])
const renderLeaf = useCallback(props => <Leaf {...props} />, [])
const editor = useMemo(() => withHistory(withReact(createEditor())), [])
update-as told, I've added the code where i pass my values.更新-如前所述,我添加了传递值的代码。 I've used value= {value.document} where I've initialised document in the initialValues below
我使用了 value= {value.document} 我在下面的 initialValues 中初始化了文档
const TextEditor = (value, props) => {
console.log(props.value)
console.log(props.value.length)
const renderElement = useCallback(props => <Element {...props} />, [])
const renderLeaf = useCallback(props => <Leaf {...props} />, [])
const editor = useMemo(() => withHistory(withReact(createEditor())), [])
const [isPreviewModalOpen, setPreviewModal] = useState(false);
const initialValues= {
title:value.title,
document: value.document,
}
return (
<>
<div className="text-center pt-3">
<h2 style={{color: "#3D44C8", fontWeight: "bold"}}>Ask an expert</h2>
<p style={{color: "#DB262F", fontWeight: "bold", fontSize: "18px"}}>Get your questions solved within 24 hours!</p>
</div>
<Slate editor={editor} value={props.value} onChange={value => {
props.setValue(value);}} >
<div className="textEditor_toolbar">
<div className="textEditor_buttonedit">
<Navbar style={{padding: "0"}} expand="lg">
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Navbar.Brand>
<ButtonGroup>
<MarkButton format="bold" tooltip="bold" icon={faBold}/>
<MarkButton format="italic" icon={faItalic} />
<MarkButton format="underline" icon={faUnderline} />
</ButtonGroup>
<ButtonGroup>
<MarkButton2 format="code" icon={faCode}/>
<BlockButton format="bulleted-list" icon={faListUl} />
<BlockButton format="numbered-list" icon={faListOl} />
</ButtonGroup>
</Navbar.Brand>
<Nav>
<label className="custom-file-upload">
<input
type="file"
name="profileImg"
accept="image/png, image/jpeg"
multiple="false"
onChange={setImage}
/>
<FontAwesomeIcon className="custom-file-icon" icon={faPaperclip}/>
</label>
</Nav>
<Form>
<Choice />
</Form>
</Navbar.Collapse>
</Navbar>
</div>
</div>
<div>
</div>
<Editable
className="textEditorMain"
renderElement={renderElement}
renderLeaf={renderLeaf}
value={value.document}
placeholder="Type your Question, Paste your Question text or Attach images or PDF here"
spellCheck
autoFocus
useReadOnly
onPaste = {onPaste}
onKeyPress={event => {
for (const hotkey in HOTKEYS) {
if (isHotkey(hotkey, event )) {
event.preventDefault()
const mark = HOTKEYS[hotkey]
toggleMark(editor, mark)
}
}
}}
/>
</Slate>
props.value
is undefined, make sure you are correctly passing your props props.value
未定义,请确保您正确传递了您的道具
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.