微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

我正在使用 Draft.js 在 Nodejs、React.js 中创建帖子表单,但出现“markdown”元素或其他内容的类型错误

如何解决我正在使用 Draft.js 在 Nodejs、React.js 中创建帖子表单,但出现“markdown”元素或其他内容的类型错误

我正在使用 Draft.js 所见即所得。 newsImage 和 title 正在工作,但我从降价中收到错误。我该如何解决?我还从控制台收到了 500 条内部错误消息。 我认为这个错误属于元素类型。尽管如此,有经验的程序员怎么说?

import "./write.css";
import axios from "axios";
import { Context } from "../../context/Context";
import { Editor } from "react-draft-wysiwyg";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
import { Container,Row,Col } from "react-bootstrap";
import { EditorState } from "draft-js";
import "draft-js/dist/Draft.css";

export default function Write() {
  const [title,setTitle] = useState("");
  const [markdown,setDesc] = React.useState(() => EditorState.createEmpty());
  const [file,setFile] = useState(null);
  const { user } = useContext(Context);

  const handleSubmit = async (e) => {
    e.preventDefault();
    const newPost = {
      username: user.username,title,markdown,};
    if (file) {
      const data = new FormData();
      const filename = Date.Now() + file.name;
      data.append("name",filename);
      data.append("file",file);
      newPost.newsImage = filename;
      try {
        await axios.post("/images",data);
      } catch (err) {}
    }
    try {
      const res = await axios.post("http://localhost:5000/articles",newPost);
      window.location.replace("/articles" + res.data._id);
    } catch (err) {
      console.log("post error!!");
    }
  };
  return (
    <>
      <Container>
        <Row>
          <Col>
            <div className="write">
              {file && (
                <img
                  className="writeImg"
                  src={URL.createObjectURL(file)}
                  alt=""
                />
              )}
              <form className="writeForm" onSubmit={handleSubmit}>
                <div className="writeFormGroup">
                  <label htmlFor="fileInput">
                    <i className="writeIcon fas fa-plus"></i>
                  </label>
                  <input
                    type="file"
                    id="fileInput"
                    style={{ display: "none" }}
                    onChange={(e) => setFile(e.target.files[0])}
                  />
                  <input
                    type="text"
                    placeholder="Title"
                    className="writeInput"
                    autoFocus={true}
                    onChange={(e) => setTitle(e.target.value)}
                  />
                </div>
                <div className="writeFormGroup">
                  <Editor
                    editorState={markdown}
                    onEditorStateChange={setDesc}
                  />
                </div>
                <button className="writeSubmit" type="submit">
                  Publish
                </button>
              </form>
            </div>
          </Col>
        </Row>
      </Container>
    </>
  );
}

下面的猫鼬模式文件


const articleModels = new mongoose.Schema(
    {
        title: { type: String,required: false,unique: true },markdown:  {
            type: String
},newsImage: {
            type: Object,}
    },{ timestamps: true }
);

module.exports = Article = mongoose.model("article",articleModels); 

这是错误信息

  _immutable: {
    allowUndo: true,currentContent: {
      entityMap: {},blockMap: [Object],selectionBefore: [Object],selectionAfter: [Object]
    },decorator: { _decorators: [Array] },directionMap: { '5jv3m': 'LTR' },forceSelection: false,inCompositionMode: false,inlinestyleOverride: null,lastChangeType: 'insert-characters',nativelyRenderedContent: null,redoStack: [],selection: {
      anchorKey: '5jv3m',anchorOffset: 14,focusKey: '5jv3m',focusOffset: 14,isBackward: false,hasFocus: false
    },treeMap: { '5jv3m': [Array] },undoStack: [ [Object] ]
  }
}" (type Object) at path "markdown"
    at ValidationError.inspect (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\error\validation.js:47:26)
    at internal/per_context/primordials.js:23:32
    at formatValue (internal/util/inspect.js:775:19)
    at inspect (internal/util/inspect.js:337:10)
    at formatWithOptionsInternal (internal/util/inspect.js:2008:40)
    at formatWithOptions (internal/util/inspect.js:1890:10)
    at console.value (internal/console/constructor.js:323:14)
    at console.log (internal/console/constructor.js:358:61)
    at D:\AsiaCons\realProject\api\routes\articleRouter.js:21:17
    at processticksAndRejections (internal/process/task_queues.js:93:5) {
  errors: {
    markdown: CastError: Cast to string Failed for value "{
      _immutable: {
        allowUndo: true,currentContent: {
          entityMap: {},selectionAfter: [Object]
        },selection: {
          anchorKey: '5jv3m',hasFocus: false
        },undoStack: [ [Object] ]
      }
    }" (type Object) at path "markdown"
        at SchemaString.cast (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\schema\string.js:603:11)
        at model.<anonymous> (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\schema\string.js:362:16)
        at SchemaString.SchemaType._applySetters (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\schematype.js:1075:20)
        at SchemaString.SchemaType.applySetters (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\schematype.js:1099:16)
        at model.$set (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\document.js:1278:20)
        at model.$set (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\document.js:1022:16)
        at model.Document (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\document.js:147:12)
        at model.Model (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\model.js:105:12)
        at new model (D:\AsiaCons\realProject\api\node_modules\mongoose\lib\model.js:4706:15)
        at D:\AsiaCons\realProject\api\routes\articleRouter.js:13:28
        at Layer.handle [as handle_request] (D:\AsiaCons\realProject\api\node_modules\express\lib\router\layer.js:95:5)
        at next (D:\AsiaCons\realProject\api\node_modules\express\lib\router\route.js:137:13)
        at Route.dispatch (D:\AsiaCons\realProject\api\node_modules\express\lib\router\route.js:112:3)
        at Layer.handle [as handle_request] (D:\AsiaCons\realProject\api\node_modules\express\lib\router\layer.js:95:5)
        at D:\AsiaCons\realProject\api\node_modules\express\lib\router\index.js:281:22
        at Function.process_params (D:\AsiaCons\realProject\api\node_modules\express\lib\router\index.js:335:12) {
      stringValue: '"{\n' +
        '  _immutable: {\n' +
        '    allowUndo: true,\n' +
        '    currentContent: {\n' +
        '      entityMap: {},\n' +
        '      blockMap: [Object],\n' +
        '      selectionBefore: [Object],\n' +
        '      selectionAfter: [Object]\n' +
        '    },\n' +
        '    decorator: { _decorators: [Array] },\n' +
        "    directionMap: { '5jv3m': 'LTR' },\n" +
        '    forceSelection: false,\n' +
        '    inCompositionMode: false,\n' +
        '    inlinestyleOverride: null,\n' +
        "    lastChangeType: 'insert-characters',\n" +
        '    nativelyRenderedContent: null,\n' +
        '    redoStack: [],\n' +
        '    selection: {\n' +
        "      anchorKey: '5jv3m',\n" +
        '      anchorOffset: 14,\n' +
        "      focusKey: '5jv3m',\n" +
        '      focusOffset: 14,\n' +
        '      isBackward: false,\n' +
        '      hasFocus: false\n' +
        '    },\n' +
        "    treeMap: { '5jv3m': [Array] },\n" +
        '    undoStack: [ [Object] ]\n' +
        '  }\n' +
        '}"',messageformat: undefined,kind: 'string',value: [Object],path: 'markdown',reason: null,valueType: 'Object'
    }
  },_message: 'article validation Failed'
}```

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。