Material-ui: [टेबल] क्षैतिज स्क्रॉलिंग टेबल बॉडी कट ऑफ

समस्या विवरण

जब किसी तालिका में कई कॉलम होते हैं जैसे कि उन्हें एक साथ प्रदर्शित नहीं किया जा सकता है, तो एक क्षैतिज स्क्रॉलबार डिफ़ॉल्ट रूप से प्रकट होता है। इस स्क्रॉलबार का उपयोग करते समय, हेडर अपेक्षित रूप से स्क्रॉल करता है, लेकिन टेबल बॉडी कटऑफ हो जाती है क्योंकि इसका ओवरफ्लो छिपा हुआ है। तालिका घटक में `बॉडी स्टाइल = {{ऊंचाई: 'विरासत', अतिप्रवाह: 'ऑटो'}} जोड़ने से दूसरा क्षैतिज स्क्रॉलबार प्राप्त होता है, एक जो शरीर को ठीक से नियंत्रित करता है, दूसरा जो शीर्षलेख को नियंत्रित करता है।

प्रजनन के चरण

      <Table>
        <TableHeader>
          <TableRow>
            {this.props.tableHeader.map((col, i) =>
              <TableHeaderColumn style={{ width: 100 }} key={i}>{col}</TableHeaderColumn>
            )}
          </TableRow>
        </TableHeader>
        <TableBody preScanRows={false}>
          {this.props.tableData.map((row, i) => (
            <TableRow key={i}>
              {this.props.tableHeader.map((col, j) => (
                <TableRowColumn style={{ width: 100 }} key={j}>{row[col]}</TableRowColumn>
              ))}
            </TableRow>
          ))}
        </TableBody>
      </Table>

संस्करणों

• सामग्री-यूआई: 0.15.0
• प्रतिक्रिया: 15.0.2
• ब्राउज़र: क्रोम 50.0.2661.102 (64-बिट)