小编Sho*_*mon的帖子

如何使用react和typescript根据条件显示元素?

我想根据使用反应表和打字稿从表数据中获取的特定条件显示 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。有人可以帮我解决这个问题吗?谢谢。

typescript reactjs

5
推荐指数
1
解决办法
5783
查看次数

有没有办法在 initstate flutter 中访问屏幕高度和宽度?

我正在尝试预加载图像并在 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)

flutter flutter-layout

4
推荐指数
1
解决办法
4405
查看次数

使用Angular中的一个管道过滤表中的多个列

嗨,大家好.我想为我的表创建一个自定义过滤器,它会引入多个参数来搜索多个列.在我的情况下,现在只能传递一个参数.提前致谢

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)

javascript typescript angular

3
推荐指数
1
解决办法
5084
查看次数

react-responsive-modal :当我们点击 div 外部时如何防止模式关闭

我正在使用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)

html javascript css modal-dialog reactjs

1
推荐指数
1
解决办法
3570
查看次数