Reagieren Sie auf Komponenten von Drittanbietern im nativen Stil, indem Sie Wrapper hinzufügen-Fragen und Antworten zum chinesischen PHP-Netzwerk
Reagieren Sie auf Komponenten von Drittanbietern im nativen Stil, indem Sie Wrapper hinzufügen
P粉122932466
P粉122932466 2024-01-10 18:12:19
0
1
620

Meine Frage:

Ich versuche, der von „react-native-popup-menu“ bereitgestellten Komponente meine eigenen Stile hinzuzufügen und sie meiner Komponentenbibliothek hinzuzufügen. Sie stellen Menu-, MenuOptions- und MenuOption-Komponenten mit der folgenden erwarteten Hierarchie bereit:

       

Ich habe vor, für jedes Element einen Wrapper zu erstellen, die darin enthaltene Komponente zu formatieren und den Wrapper zurückzugeben, wenn ihn jemand aus der Komponentenbibliothek importiert.

Zum Beispiel ein Wrapper für die Menükomponente:

import { MenuProps } from 'react-native-popup-menu'; type CustomMenuProps = { children: React.ReactElement[]; } const CustomMenu = (props: MenuProps && CustomMenuProps) => { return {children} }

Dadurch wird auf jeder Ebene ein Wrapper (ein zusätzliches Element) hinzugefügt, was zu der folgenden Hierarchie führt:

   ...

Dem Paket gefällt das nicht, weil es auf Hierarchie angewiesen ist, um das Menü korrekt anzuzeigen. Löst den Fehler „MenuOptions sollte ein untergeordnetes Element von Menu sein“ aus

Gibt es eine Möglichkeit, ein benutzerdefiniertes Menü zu erstellen und es als Komponente in der Komponentenbibliothek verfügbar zu machen? Wenn es reagieren würde, würde ich die CSS-Klasse neu schreiben, aber in React-Native gibt es keinen Kaskadeneffekt.

Jeder Hinweis wäre sehr hilfreich. Danke.

P粉122932466
P粉122932466

Antworte allen (1)
P粉787934476

我不确定到底是什么问题 - 所以我只是在此处添加一些可能对您有帮助的提示/线索。

查看文档https:// github.com/instea/react-native-popup-menu/blob/master/doc/extensions.md和相应的示例

从中我看到您可以执行/使用以下操作:

  1. MenuOptions 的样式是原生支持的,没有任何问题
const CheckedOption = (props) => (  )
  1. 选项容器的自定义样式似乎也可以

你只需要一点样板文件(参见示例) - 我想将其包装到自定义组件中不是问题

  1. 任何“左侧”样式都是接受任何子项的触发器...现在不确定是否可以轻松地将其包装到您自己的组件中...
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!