在ReactJS的物料界面(Material-UI)的SwipeableDrawer组件中发送参数,可以通过以下步骤实现:
npm install @material-ui/core
import React, { useState } from 'react';
import SwipeableDrawer from '@material-ui/core/SwipeableDrawer';
function MyComponent() {
const [isOpen, setIsOpen] = useState(false);
const toggleDrawer = (open) => (event) => {
if (
event &&
event.type === 'keydown' &&
(event.key === 'Tab' || event.key === 'Shift')
) {
return;
}
setIsOpen(open);
};
return (
<div>
<button onClick={toggleDrawer(true)}>打开抽屉</button>
<SwipeableDrawer
anchor="left"
open={isOpen}
onClose={toggleDrawer(false)}
onOpen={toggleDrawer(true)}
>
{/* 在这里放置抽屉的内容 */}
</SwipeableDrawer>
</div>
);
}
const toggleDrawer = (param) => (event) => {
// 使用参数param进行操作
console.log(param);
if (
event &&
event.type === 'keydown' &&
(event.key === 'Tab' || event.key === 'Shift')
) {
return;
}
setIsOpen(open);
};
<button onClick={toggleDrawer('参数值')}>打开抽屉</button>
请注意,以上答案中没有提及腾讯云相关产品和产品介绍链接地址,因为题目要求不提及亚马逊AWS、Azure、阿里云、华为云、天翼云、GoDaddy、Namecheap、Google等流行的云计算品牌商。如需了解腾讯云相关产品和产品介绍,请访问腾讯云官方网站。
领取专属 10元无门槛券
手把手带您无忧上云