在react Datepicker中选择特定用户时,是否可以禁用特定日期
f8rj6qna1#
你可以使用excludeDates来完成这个任务,它是一个Date对象的数组:
<DatePicker selected={startDate} onChange={(date) => setStartDate(date)} excludeDates={[new Date(), subDays(new Date(), 1)]} placeholderText="Select a date other than today or yesterday" />
vwkv1x7d2#
我从这句话中了解到,您希望为某些用户禁用特定日期,例如基于角色的访问假设您这样保存用户数据
user = { name: 'ABC', email: 'abc@abc.com', role: 'Admin' //Admin, User, etc.. };
然后,您可以像这样控制excludeDates属性
excludeDates
excludeDates={user.role !== 'Admin' ? [new Date(), subDays(new Date(), 1)] : []}
UPDATE您可以像这样从端点获取用户数据
useEffect(() => { apiEndpoint .then(result => setUser(result.data)) .catch(error => console.log(error)) }, [])
zvms9eto3#
我遇到了同样的问题,发现最简单的解决方案是使用excludeDates并将addDays(new Date(), 5)〈-- 5(您希望排除的日期)添加到数组中,然后删除selectsRange:
addDays(new Date(), 5)
selectsRange
... return ( <DatePicker selected={startDate} onChange={onChange} startDate={startDate} endDate={endDate} excludeDates={[addDays(new Date(), 1), addDays(new Date(), 5), addDays(new Date(), 7), addDays(new Date(), 12) ]} //selectsRange selectsDisabledDaysInRange inline /> ); };
3条答案
按热度按时间f8rj6qna1#
你可以使用excludeDates来完成这个任务,它是一个Date对象的数组:
vwkv1x7d2#
选择特定用户时
我从这句话中了解到,您希望为某些用户禁用特定日期,例如基于角色的访问
假设您这样保存用户数据
然后,您可以像这样控制
excludeDates
属性UPDATE您可以像这样从端点获取用户数据
zvms9eto3#
我遇到了同样的问题,发现最简单的解决方案是使用
excludeDates
并将addDays(new Date(), 5)
〈-- 5(您希望排除的日期)添加到数组中,然后删除selectsRange
: