具有打字稿的Reactjs和样式化的动态道具

时间:2020-05-22 01:30:04

标签: reactjs typescript emotion

我用这个CSS制作了一个带有CSS EmotionJS的动态Flex容器:

// return the pet
public VirtualPet removePet(String name) {
        for (int i = 0; i < pets.size(); i++) {
            if (pets.get(i).getName().equals(name)) {                
                return pets.remove(i); // API  https://docs.oracle.com/javase/8/docs/api/java/util/List.html#remove-int-
            }
        }
        return null;
    }

// then you can add this to other object
VirtualPet pet = branch1. removePet("something");
if (pet != null) {
    branch2.addPet(pet);
}

我将这个作为我的组件:

export const Flex = (
  display?: boolean,
  align?: string,
  justify?: string,
  column?: boolean,
  wrap?: boolean,
  fluid?: boolean
) => css`
  display: ${display ? 'flex' : 'none'};
  flex-direction: ${column ? 'column' : 'row'};
  align-items: ${align};
  flex-wrap: ${wrap ? 'wrap' : 'nowrap'};
  justify-content: ${justify};
  ${fluid
    ? `
        flex: 1 0 auto;
      `
    : ''}
    `

但是我觉得我做错了 因为我在flex容器上打过字 在我的组件上输入弹性

我想知道如何更简单地使用打字稿

0 个答案:

没有答案