J'utilise la table de matériaux ( https://material-table.com/#/) Pour mon projet. J'ai mis en place la fonction "panneau de détail" ( https: // Tableau de matériau. Com / # / Documents / Fonctionnalités / Panneau de détail ) et ont également activé la fonction de recherche.
À mes connaissances, la fonction "Recherche" recherchera uniquement des valeurs "String" dans n'importe quelle colonne de la table. p>
Mon panneau de détail contient du texte à l'intérieur d'une étiquette de pré-balise HTML. P>
detailPanel={rowData => {
return <pre style={preCss}>{rowData.releaseNote}</pre>;
}}
3 Réponses :
Pour quiconque ayant le même problème, je crois avoir trouvé une solution de contournement. J'ai ajouté le "rowdata.releasenote" code> comme entrée de colonne dans la table principale. Mais ensuite je me suis mis à zéro, les largeurs de la tête et des cellules cellulentes et définissent Affichage: Aucune code>. Si essentiellement, les données existent comme une colonne invisible dans la table. {
title: "",
field: "releaseNote",
sorting: false,
filtering: false,
headerStyle: { display: "none", width: "0px", maxWidth: "0px" },
cellStyle: { display: "none", width: "0px", maxWidth: "0px" }
}
Où ajoutes-tu ce morceau de code? À l'intérieur de la propriété détaillée de la carte matérielle?
La solution de Wai Ha Lee provoquera un espacement étrange dans les colonnes dans ma table de matières, j'utilise celui-ci pour résoudre le problème:
Ajout:
{
hidden: true,
}
Si c'est un duplicata, ce n'est pas évident. L'autre réponse a beaucoup plus de code et ne souligne pas que la partie importante / essentielle de la solution n'est que la règle cachée . Cette réponse implique que "caché" est la seule pièce nécessaire pour résoudre le problème. Cela dit, cela pourrait bénéficier d'une explication. Les réponses de code seulement sont découragées.