React 按钮未将组件添加到页面
P粉731861241
P粉731861241 2024-03-20 10:46:45
0
1
387

“添加项目”按钮应触发带有输入字段的弹出表单,但该表单未呈现。只需使用按钮即可在渲染时显示空白页面。

import './App.css';

const InventoryManager = () => {
  
        dispatch(addItem(newItem));

        // Reset the input fields
        setItemName('');
        setItemDescription('');
        setItemPrice('');
        setItemImage('');

        // Close the popup form
        setShowPopup(false);
    };

    const handleClearForm = () => {
        // Clear the input fields
        setItemName('');
        setItemDescription('');
        setItemPrice('');
        setItemImage('');
    };

    return (
        <div>
            <h1>Inventory Manager</h1>

            <div id="buttons">
                <button onClick={() => setShowPopup(true)}>Add Item</button>
            </div>

            {showPopup && (
                <div id="add-item-popup">
                    <div id="popup-header">
                        <h2>Add Item</h2>
                        <button id="close-button" onClick={() => setShowPopup(false)}>
                            X
                        </button>
                    </div>
                   
      
                    </form>
                </div>
            )}

            <div id="inventory-gallery">{/* Render inventory items here */}</div>
        </div>
    );
};

export default InventoryManager;

尝试在单个文件和不同的组件文件中实现,但表单仍然无法呈现。

P粉731861241
P粉731861241

全部回复(1)
P粉504920992

首先,您的文件格式不正确。例如,第15行有多余的括号。另一方面,您在代码中使用了未定义的函数,例如函数dispatch和setItemName。我建议阅读关于钩子的官方 React 文档

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板