我想根据使用反应表和打字稿从表数据中获取的特定条件显示 div 元素
代码
const buildColumns: (mode: someMode,) => (mode) => [
{
Header: 'Name',
id: 'name',
Cell: props => {
const isActive = props.row.original.isActive === true
|| props.row.original.isActive === null;
return (
{!isActive &&
<div>show me</div>
});
}
]
Run Code Online (Sandbox Code Playgroud)
现在,如果isActive不是null,如果isActive是,false我应该显示 div 元素。我怎么能做到呢。
isActive即使is ,上述条件也会显示它null。有人可以帮我解决这个问题吗?谢谢。
我正在尝试预加载图像并在 initstate 中声明一次
例子:
late List<String> _assetBg;
late List<Image> _imagesBg;
@override
void initState() {
// TODO: implement initState
super.initState();
_assetBg = ['assets/images/1.jpg',
'assets/images/2.jpg',
'assets/images/3.jpg',
'assets/images/4.jpg'];
_imagesBg = _initializeListImage(context, _assetBg);
WidgetsBinding.instance!.addPostFrameCallback((timeStamp) {
_tombolRenderBox =
_tombolKey.currentContext!.findRenderObject() as RenderBox;
});
}
Run Code Online (Sandbox Code Playgroud)
问题是 :
List<Image> _initializeListImage (BuildContext context,List<String> assets){
List<Image> result = [];
for (var asset in assets) {
result.add(
Image(
image: AssetImage(asset),
///Problem is here :
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width * 2,
fit: BoxFit.cover,
)
);
}
return result;
}
Run Code Online (Sandbox Code Playgroud)
并在此处预重新加载:
@override
void …Run Code Online (Sandbox Code Playgroud) 嗨,大家好.我想为我的表创建一个自定义过滤器,它会引入多个参数来搜索多个列.在我的情况下,现在只能传递一个参数.提前致谢
component.html
<tr *ngFor = "let builder of builderDetailsArray[0] | filter :'groupName': searchString; let i = index" >
<td style="text-align: center;"><mat-checkbox></mat-checkbox></td>
<td>{{builder.builderId}}</td>
<td>{{builder.viewDateAdded}}</td>
<td>{{builder.viewLastEdit}}</td>
<td>{{builder.groupName}}</td>
<td>{{builder.companyPersonName}}</td>
<td style="text-align: center;"><button mat-button color="primary">UPDATE</button></td>
</tr>
Run Code Online (Sandbox Code Playgroud)
pipe.ts
@Pipe({
name: "filter",
pure:false
})
export class FilterPipe implements PipeTransform {
transform(items: any[], field: string, value: string): any[] {
if (!items) {
return [];
}
if (!field || !value) {
return items;
}
return items.filter(singleItem =>
singleItem[field].toLowerCase().includes(value.toLowerCase()) );
}
Run Code Online (Sandbox Code Playgroud) 我正在使用react-responsive-modal来实现我的模式。我面临的一个问题是,当我单击屏幕上模态 div 之外的任意位置时,我的模态将关闭。我希望仅当我单击取消或关闭按钮时才关闭我的模式。我找到了 onOverlayClick 函数道具,并用它来应用 PreventDefault 但它没有用。
任何人都可以建议一种实现此功能的方法。提前致谢。
class CustomModal extends Component{
constructor(props) {
super(props);
}
onOverlay = (e) =>{
e.preventDefault();
}
render(){
const { props } = this;
return(
<Modal open={props.open} onClose={props.onCloseModal}
onOverlayClick={e =>this.onOverlay(e)} center>
<div className="on-setting-modal">
<h6>"are you sure ?"</h6>
<div className="on-setting-modal-buttons">
{
!!props.showCancel &&
<button onClick={props.onCloseModal} >Cancel</button>
}
<button onClick={props.onOkModal} >OK</button>
</div>
</div>
</Modal>
)
}
}
export default CustomModal
Run Code Online (Sandbox Code Playgroud)