如何使列表的第一项始终位于顶部，而列表的其余部分将独立于它滚动

Question

是否可以将列表的第一项定位到列表的顶部并且不与其他项一起滚动？

     <Select

            open={open}

            value={value}

            onChange={this.handleSelectChange}

            onClose={this.handleSelectClose}

            onOpen={this.handleSelectOpen}

          >

            <MenuItem

              style={{

                backgroundColor: "transparent"

              }}

            >

              <TextField

                value={search}

                fullWidth

                placeholder="search"

                onChange={this.handleInputChange}

              />

            </MenuItem>

            {filteredOptions.length ? (

              filteredOptions.map(option => {

                return (

                  <MenuItem value={option} key={option.value}>

                    {option.label}

                  </MenuItem>

                );

              })

            ) : (

              <MenuItem disabled>No match</MenuItem>

            )}

     </Select>

它看起来像https://sharlaan.github.io/example3上的自动完成

Answer 1

链接不起作用，我没有看到你的例子。但是，这是在这种情况下您需要的样式示例：Selectposition: relative // necessaryheight: 123px // optionaloverflow-y: scroll // optionalMenuItem // first one onlyposition: absolute // necessarytop: 0px // optionalz-index:10 // optionalbackground-color: white // optional