Return to Question

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I register it on block.json:

 "attributes": {
        "content": {
            "type": "string",
            "selector": "h2"
        }
    },

Then I used it on edit.js

 export default function Edit({attributes: {content}}) {
      const blockProps = useBlockProps();

     return (
      
         <p {...useBlockProps()}>
             <input value={content} />
               <TextControl label="Question:" value={content}
                allowedFormats={["core/italic"]}
                onChange={(content) => setAttributes({ content })} />
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }

update:

actually I can change the value I use two methods: onChange={x => setAttributes({content: x})} and second one onChange={updateValue} function updateValue (index) { setAttributes({content: index}) }

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I register it on block.json:

 "attributes": {
        "content": {
            "type": "string",
            "selector": "h2"
        }
    },

Then I used it on edit.js

 export default function Edit({attributes: {content}, setAttribute}) {
      const blockProps = useBlockProps();

     return (
      
         <p {...useBlockProps()}>
             <input value={content} />
               <TextControl label="Question:" value={content}
                allowedFormats={["core/italic"]}
                onChange={x => setAttributes({content: x})} >
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }

this method work but I have an error. I cannot write all sentence but just first letter and it refresh my input.

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I register it on block.json:

 "attributes": {
        "content": {
            "type": "string",
            "selector": "h2"
        }
    },

Then I used it on edit.js

 export default function Edit({attributes: {content}}) {
      const blockProps = useBlockProps();

     return (
      
         <p {...useBlockProps()}>
             <input value={content} />
               <TextControl label="Question:" value={content}
                allowedFormats={["core/italic"]}
                onChange={(content) => setAttributes({ content })} />
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I register it on block.json:

 "attributes": {
        "content": {
            "type": "string",
            "selector": "h2"
        }
    },

Then I used it on edit.js

 export default function Edit({attributes: {content}}) {
      const blockProps = useBlockProps();

     return (
      
         <p {...useBlockProps()}>
             <input value={content} />
               <TextControl label="Question:" value={content}
                allowedFormats={["core/italic"]}
                onChange={(content) => setAttributes({ content })} />
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }

update:

actually I can change the value I use two methods: onChange={x => setAttributes({content: x})} and second one onChange={updateValue} function updateValue (index) { setAttributes({content: index}) }

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I tried in block.json and in index.js but this not register them cause after refreshing page, there is noting to change.

This is my edit.js

 export default function Edit(attributes, setAttributes) {
  
     return (
      
         <p {...useBlockProps()}>
             <input value={attributes.content} />
               <TextControl label="Question:" value={attributes.content}
                allowedFormats={["core/italic"]}
                onChange={(content) => setAttributes({ content })} />
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }

and this is how I tried register it on index.js

egisterBlockType(name, {
    ...settings,
    attributes: {
        content: {
            type: "string",
            selector: "h2",
        },
    },
    /**
     * @see ./edit.js
     */
    edit,

    /**
     * @see ./save.js
     */
    save,
});

I try to make a Gutenberg plugin but I have problem to set a value of attributes. I npm this template npx @wordpress/create-block example-plugin --template @ryanwelcher/multiple-blocks-template because I want create a multiblock plugin. the problem is where and how register attributes.

I register it on block.json:

 "attributes": {
        "content": {
            "type": "string",
            "selector": "h2"
        }
    },

Then I used it on edit.js

 export default function Edit({attributes: {content}}) {
      const blockProps = useBlockProps();

     return (
      
         <p {...useBlockProps()}>
             <input value={content} />
               <TextControl label="Question:" value={content}
                allowedFormats={["core/italic"]}
                onChange={(content) => setAttributes({ content })} />
             {__('larum ipsume', 'page-builder')}
         </p>
     );
 }