Question

我有一个react应用，我正在尝试使用material-ui 1.0及其JSS解决方案。它似乎对对齐属性的任何对齐都没有响应。我希望下面的代码居中对齐，但它没有发生。我已将代码放置在我能想到的每个配置中，但无法正常工作。

我感觉可能是某些东西被误命名了，但是matrial-ui并没有很好地记录它的jss解决方案，这是我第一次使用该系统来设计应用程序样式。

def test_encode_multi_valued_categorical_features(self):
    categorical_features = ['productCategories', 'productTypes']
    input_data_frame = pd.DataFrame({'querySource': ['source1', pd.np.nan, 'source3'],
                                     'productTypes': [["t1", "t2", "t3"], ["t6", "t4", "t3"], ["t6", "t1"]],
                                     'productBrand': ['brand1', 'brand2', 'brand3'],
                                     'productCategories': [["c1", "c2", "c3"], ["c6", "c4", "c3"], ["c6", "c1"]],
                                     })
    expected_data_frame = pd.DataFrame({'querySource': ['source1', pd.np.nan, 'source3'],
                                        'productBrand': ['brand1', 'brand2', 'brand3'],
                                        'productCategories_c1': [True, False, True],
                                        'productCategories_c2': [True, False, False],
                                        'productCategories_c3': [True, True, False],
                                        'productCategories_c4': [False, True, False],
                                        'productCategories_c6': [False, True, True],
                                        'productTypes_t1': [True, False, True],
                                        'productTypes_t2': [True, False, False],
                                        'productTypes_t3': [True, True, False],
                                        'productTypes_t4': [False, True, False],
                                        'productTypes_t6': [False, True, True],
                                        })

    result = utils.encode_multi_valued_categorical_features3(input_data_frame, categorical_features)
    pd.testing.assert_frame_equal(result, expected_data_frame)

Answer 1

您可以尝试alignitem并证明Grid自身提供的合理性：

尝试：

 <div id={"root"} className={classes.root}>
  <div className={classes.river}
    <Grid 
     spacing={0}
     direction="column"
     alignItems="center"
     justify="center"
    >
     <Grid item xs={3}>
      <LoginPage /> 
     </Grid>
    </Grid>
   </div>
  </div>

请发现我已经使用xs = {3}作为登录页面的响应宽度。随时更改这些值。

希望这会对您有所帮助

Material-ui jss不尊重证明内容

1 个答案: