Ant-design: 💥 Ant Design 4.0 ist in Bearbeitung!

Erstellt am 31. Mai 2019 · 182Kommentare · Quelle: ant-design/ant-design

Vorschau der Site

next.ant.design

Rekapitulieren

Seit der Veröffentlichung von Ant Design 3.0 im Dezember 2017 sind 16 Monate vergangen. Wir haben viele Fehler behoben und viele neue Funktionen ( Changelog ) innerhalb von 4289 Commits, 138 Releases, 7675 Problemen und PRs hinzugefügt, die uns 25375 Sterne in GitHub eingebracht haben. Wir haben auch Ant Design Pro 4.0 veröffentlicht . Unterstützung für TypeScript, Blöcke und Abstraktion von Layouts. Wir möchten uns bei allen Mitwirkenden bedanken und Ihr Beitrag macht Ant Design immer besser.

Gleichzeitig haben wir Ant Design Pro 4.0 veröffentlicht. Unterstützt TypeScript, Block und bietet Layout-Komponente.

In diesem Moment denken wir: Ok, was kommt als nächstes? Was können wir tun, um Ant Design weiter voranzutreiben? Es ist Zeit, das Ant Design 4.0 zu planen! 🍻

Es folgt der Detailplan zu 4.0. Wir können einige davon anpassen, da sie noch in Planung sind.

🌓 Informationen zur Kompatibilität

Wir werden veraltete Requisiten in 4.0 entfernen, was bedeutet, dass veraltete Requisiten nicht mehr unterstützt werden. Wenn Sie von der neuesten Version 3.x keine Warnung erhalten, kann das Upgrade nahtlos durchgeführt werden. Andernfalls wird es nach der Veröffentlichung von 4.0 eine halbjährige Wartungsphase für 3.0 geben.

Wir wissen, dass Upgrades schwierig sind. Wir planen, ein kompatibles Paket bereitzustellen, um dies zu handhaben:

import Compatible from '@ant-design/compatible';

// It works, but will warning in console
const Demo = () => (
  <Compatible>
    <YourApp />
  </Compatible>
);

Dieses Paket ist bis zum Ende der 3.x Wartungsphase verfügbar.

Verwenden Sie die neueste React-API

Wir bieten seit langem React 15-Support. Aufgrund des sozialen Feedbacks scheint dies jedoch nicht erforderlich zu sein (es gibt fast 0% der Probleme mit React 15), da React eine starke Kompatibilität aufweist. Um React 15 zu unterstützen, verwenden wir die neue API sehr sorgfältig. Dies wird nach 4.0 kein Problem mehr sein:

Bietet Hooks-API für verwandte Komponenten
Support Concurrent Mode (Wird noch vorbereitet, wird in 4.0 weiter angepasst)
Umarmungsreaktion 17 (wow！ ~)

Beenden Sie die IE9 / 10-Unterstützung

Ant Design 3.0 unternimmt große Anstrengungen, um den alten IE zu

Anderes kompatibles Update

Weniger 2.x Upgrade auf weniger 3.x.
Symbolanpassung
Erwähnung veraltet

📦 Größe reduzieren

Symbolgröße optimieren

Wir verwenden das SVG-Symbol ( warum SVG? ) Nach [email protected] . Wir verwenden den String-Namen, um das Symbol zuzuordnen, das bei Bedarf nicht geladen werden kann. Wir importieren die gesamte Symboldatei in antd, wodurch das Bundle groß wird . Wir werden dies in 4.0 behandeln.

Die alte Art der Verwendung von Symbolen wird * veraltet *:

import { Icon, Button } from 'antd';

const Demo = () => (
  <div>
    <Icon type="smile" />
    <Button icon="smile" />
  </div>
);

Verwendet stattdessen ein einzelnes Importsymbol in 4.0:

// Directly import
import SmileOutline from 'antd/icons/SmileOutline';

// If tree-shaking supported
import { SmileOutline } from 'antd/icons';

const Demo = () => (
  <div>
    <SmileOutline />
    <Button icon={<SmileOutline />} />
  </div>
);

Sie können weiterhin kompatible Methoden auf alte Weise verwenden.

Entfernen Sie Draft.js

Wir verwenden die Komponente Draft.js in Mention, um den Popup-Speicherort zu bestätigen, es wird jedoch nur ein kleiner Teil der Funktionalität verwendet. Es scheint über die Kosten. Wir planen, Draft.js in 4.0 zu entfernen und stattdessen eine andere Lichtlösung zu verwenden. Gleichzeitig wird zur Unterscheidung mit der Origin-Mention-Komponente in 3.0 eine neue Komponente Mentions eingeführt, um API-Konflikte zu vermeiden. Außerdem unterstützt es kompatible Methoden :

// Follow Code will not work
import { Mention } from 'antd';

const Demo = () => (
  <Mention />
);

// Added `Mentions` in 4.0
import { Mentions } from 'antd';

const Demo = () => (
  <Mentions />
);

🧭 Leistungsoptimierung

Wir erhalten nur wenige Leistungsprobleme für große Datenmengen von der Community. Wir werden sicherstellen, dass hier einige Optimierungen vorgenommen werden.

Virtuelles Scrollen

Virtuelles Scrollen ist eine gängige Methode zur Leistungsoptimierung. Wir planen, dies nativ in Komponenten zu unterstützen. In Version 4.0 wird es möglicherweise nicht sofort beendet. Wird Schritt für Schritt integriert.

Refactor Animation

Wir haben in der Vergangenheit einige Hacks mit Animationen gemacht. In den meisten Fällen funktioniert es gut. Wir planen, viel reinen Reaktionsweg zu verwenden, anstatt einen zu hacken. Dieses Update wird stillschweigend sein, nichts wird Sie beeinflussen.

🧩 Komponentenoptimierung

Wir haben in 3.0 viele Komponenten hinzugefügt und werden in 4.0 fortfahren. Diese Komponenten stammen aus dem Geschäftsszenario, Ant Design Pro und den sozialen Anforderungen. Der Prozess für neue Komponenten ist der gleiche wie für Ant Design 3.0. Wir werden die zugehörige Designdatei in PR einfügen und auf der offiziellen Website sammeln. Release in jeder Nebenversion.

Außerdem planen wir, einige Schlüsselkomponenten zu überarbeiten, um die Verwendung zu vereinfachen. Beinhaltet aber nicht nur:

Bilden

Form ist eine der am häufigsten verwendeten Komponenten. Wir stellen fest, dass Social Media viele Kommentare zum API-Design hat.
Wir möchten die API in 4.0 vereinfachen:

Das Formular enthält einen Datenspeicher. Sie müssen Form.create() nicht mehr verwenden.
Fom.Item enthält Feldbindung. Sie müssen getFieldDecorator nicht mehr verwenden.
Form.Item behält den Wert bei, aber der Validator wird deaktiviert, wenn das Feld entfernt wird.

const Demo = () => {
  const [form] = Form.useForm();

  const onFinish = () => {
    // Do something...
  };

  useEffect(() => {
    // Something like ajax call
    form.setFieldsValue({
      username: 'light',
    });
  }, []);

  return (
    <Form form={form} onFinish={onFinish}>
      <Form.Item name="username" rules={[{ required: true }]}>
        <Input />
      </Form.Item>
    </Form>
  );
}

In der realen Welt treffen wir auf viel Kommunikation zwischen Formularen (normalerweise in Detailkonfiguration). Wir wollen es einfacher machen:

const { useForm, createContext } = Form;
const FormContext = createContext();

const Demo = () => {
  return (
    <FormContext>
      <YourForm1 />
      <YourForm2 />
    </FormContext>
  );
};

Wenn Sie den Fortschritt des Formulars verfolgen möchten, können Sie dies hier sehen .

Tabelle

In der Vergangenheit haben wir viele Rückmeldungen zu Tabellen erhalten . Wir wissen, dass Erweiterungs- und Bildlauf-Requisiten nicht gut zusammenarbeiten. Dieses Mal werden wir uns darauf konzentrieren, das Problem zu beheben. Außerdem werden wir viel an der Tabellenoptimierung tun. Und einfache Möglichkeit, das Layout zu erstellen:

const Demo = () => {
  return (
    <Table
      header={{
        templateAreas: `
          name    address     address
          name    building    no
        `,
        cells: [
          { key: 'name', title: 'Name' },
          { key: 'address', title: 'Address' },
          { key: 'building', title: 'Building' },
          { key: 'no', title: 'No' },
        ],
      }}
    />
  );
};

antd4-table

Wir planen auch, die Zusammenfassungsfußzeile hinzuzufügen, um die

Neuer DatePicker

Current DatePicker erfüllt die meisten Anforderungen. Aber aus der Community-Diskussion können wir mehr herausholen. Wir werden Ruhejahr Picker und Ranger Picker zur Verfügung stellen ( besprechen ). Außerdem werden wir den DatePicker-Designstil aktualisieren, um die Benutzererfahrung zu verbessern.

🚀 Aktualisieren Sie weiter

Neben den oben genannten Inhalten planen wir auch weitere Aktualisierungen. Diese werden in 4.0 ständig aktualisiert, um die Entwicklung und Benutzererfahrung zu verbessern.

🧶 Verbesserung der Zugänglichkeit

Ant Design 3.0 bietet nur eingeschränkte Unterstützung für die Barrierefreiheit. Wir planen, die Dom-Struktur anzupassen und weitere Arienmarkierungen hinzuzufügen, um das Bildschirmleseerlebnis zu verbessern. Außerdem bereiten wir uns auf die Optimierung der Tastaturinteraktion vor.

🎯 Entwickler-API-Standard

Wir stellen fest, dass einige API-Benennungsstile sich kaum von anderen unterscheiden. Für Typescript-Entwickler ist dies kein Problem, aber es ist schwer, sich an etwas anderes zu erinnern.
Daher erstellen wir ein Namensstandarddokument, das aktuelle APIs und zugehörige Namensregeln enthält. Befolgen Sie in der neuen Funktion die Namensregel, um einen API-Namenskonflikt zu vermeiden. Wir begrüßen auch Community-Meinungen dazu in der PR.

💼 Reagieren Sie auf den strengen Modus

Wenn Sie versucht haben, eine Antd-Komponente mit <React.StrictMode> verpacken, wird eine Warnung angezeigt. Wir haben bereits einige Komponenten durch eine neue Lebenszyklusmethode ersetzt. Diese Arbeit wird in 4.0 fortgesetzt.

💡 Verbessern Sie die Entwicklererfahrung

In der Vergangenheit haben wir festgestellt, dass einige Probleme wiederholt auftreten. Diese Probleme sind irgendwie Verwendungsfragen. Wir denken, wir können etwas dagegen tun (eigentlich schon ab 3.0). In der Entwicklungsumgebung warnen wir vor einem unerwarteten Status (z. B. Moment-Objekt ungültig machen, Präfix- / Affix-Anpassung verursachen Änderung der Dom-Struktur usw.). Wir glauben, dass die Konsole der erste Ort ist, an dem Sie sich auf Probleme konzentrieren können. Bietet die richtigen Tipps, um das Problem zu finden. Gleichzeitig werden wir weitere Fragen in den FAQ jedes Komponentendokuments zusammenfassen. Von der Seite der Wartung können wir nicht bei jeder Verwendungsfrage helfen, aber sie existieren, insbesondere bei neuen Entwicklern. FAQ kann helfen, viel Suchzeit zu sparen. Wenn Sie daran interessiert sind, können Sie gerne dazu beitragen, die Entwicklererfahrung bei uns zu verbessern.

🐱 Designressource

Ant Design ist nicht nur eine Komponentenbibliothek. Design ist die Unterstützungskraft. Wir werden die Aktualisierung der Designressource (Sketch-Komponentenpaket, Küchenwerkzeuge, Design Token usw.) synchronisieren. Wir werden auch den aktuellen Komponentenstil anpassen, um die Benutzererfahrung zu verbessern.

Meilensteine

Hier ist unser Meilensteinplan: Wir werden ein verwandtes Thema auf Github erstellen und auch soziale Mitwirkende begrüßen:

Q2

Markieren Sie die zugehörige API als veraltet und entfernen Sie sie aus dem Dokument.
Aktualisierung der Komponentenwarnung auf niedriger Ebene.

Q3

Erstellen Sie einen Antd 4.0-Zweig und aktualisieren Sie das Dokument.
Komponentenentwicklung.

Q4

Geben Sie Ant Design 4.0 frei.

Willkommen an Bord

Wir werden Sie während des Entwicklungsprozesses auf dem Laufenden halten. Der obige Inhalt ist möglicherweise nicht endgültig. Gedanken / Ratschläge der Community sind mehr als willkommen! Lassen Sie uns Ant Design 4.0 verbessern!

Einführung

Es ist 16 Monate her, seit Ant Design im Dezember 2017 3.0 veröffentlicht hat. In diesem Zeitraum haben wir eine große Anzahl von Fehlern behoben und eine große Anzahl neuer Funktionen hinzugefügt ( Aktualisierungsprotokoll ). 4289 Commits eingereicht, 138 Versionen veröffentlicht, 7675 Ausgaben und PRs geschlossen und 25375 Sterne hinzugefügt. Wir haben auch Ant Design Pro 4.0 veröffentlicht . Unterstützt TypeScript, blockiert und abstrahiert das Layout. Wir möchten allen Freiwilligen der Community für Ihr Engagement danken, um Ant Design benutzerfreundlicher zu machen.

Gleichzeitig überlegen wir, was der nächste Schritt ist und wie Ant Design weiterentwickelt werden kann. Wir gehen davon aus , dass

Das Folgende ist ein detaillierter Plan für 4.0, dies ist natürlich noch in Planung. Es kann Anpassungen geben, wenn es offiziell veröffentlicht wird.

🌓 Kompatibilitätsanpassung

Wir werden die Attribute entfernen, die in 4.0 als veraltet markiert sind. Zu diesem Zeitpunkt können Sie die abgebrochene Methode nicht mehr verwenden. Wenn Sie Ihr Projekt auf die neueste Version 3.x aktualisieren und die Warnmeldung von antd in der Konsole nicht angezeigt wird, ist auch die Aktualisierung auf 4.0 nahtlos. Für die 3.x-Version werden wir nach der Version 4.0 noch weitere sechs Monate Wartungsarbeiten durchführen.

Wir wissen, dass die Upgrade-Version viel Energie hat, um die veraltete API aufzugeben. Wir planen, ein kompatibles Paket bereitzustellen, das den Projektübergang bei der Veröffentlichung von 4.0 unterstützt (die zugehörige API befindet sich noch im Entwurf und kann bei der offiziellen Veröffentlichung anders sein):

import Compatible from '@ant-design/compatible';

// It works, but will warning in console
const Demo = () => (
  <Compatible>
    <YourApp />
  </Compatible>
);

Das Kompatibilitätspaket bleibt auch aktualisiert, bis die 3.0-Wartungsarbeiten beendet werden.

Verwenden Sie die neueste Version der React API

Wir unterstützen die React 15-Version schon seit langer Zeit, aber aufgrund des Community-Feedbacks ist dies eigentlich nicht wichtig (die Ausgabenummer von React 15 nähert sich 0%). Weil React selbst eine sehr robuste Kompatibilität hat. Um React 15 zu unterstützen, achten wir sehr auf die Verwendung neuer APIs während des Entwicklungsprozesses. Nach Version 4.0 verwenden wir die neueste React-Version als Benchmark für die Entwicklung:

Stellen Sie die Hooks-Version der zugehörigen Komponenten bereit
Support Concurrent Mode (Natürlich gibt es viele Dinge vorzubereiten und wird in der Version 4.0 weiter angepasst.)
Umarmungsreaktion 17 (wow! ~)

Beenden Sie die IE9 / 10-Unterstützung

Ant Design 3.0 hat große Anstrengungen unternommen, um mit der alten Version von IE kompatibel zu sein. Laut Branchenstatistiken schrumpft jedoch sowohl der globale als auch der inländische Anteil des IE9 / 10-Browsers mit dem Windows-Systemupdate. In Version 4.0 werden wir die Unterstützung von IE 9/10 einstellen (aber weiterhin IE 11 unterstützen). Dies bedeutet auch, dass neue Browserfunktionen unterstützt werden können.

Andere Kompatibilitätsanpassungen

Upgrade von Less 2.x auf Less 3.x.
Änderung der Symbolnutzung
Erwähnen Sie obsolet

📦 Lautstärke reduzieren

Symbolgröße optimieren

In [email protected] haben wir das SVG-Symbol eingeführt ( warum das SVG-Symbol verwenden? ). Die API zum Festlegen von Symbolen mit Zeichenfolgenbenennung wird verwendet. Bei diesem Entwurf können wir nicht bei Bedarf laden. Daher haben wir alle SVG-Symboldateien eingeführt, wodurch die Größe des verpackten Produkts erheblich erhöht wird . In 4.0 werden wir dies anpassen, um die Lautstärke zu optimieren.

Die alte Version der Symbolverwendung ist veraltet :

import { Icon, Button } from 'antd';

const Demo = () => (
  <div>
    <Icon type="smile" />
    <Button icon="smile" />
  </div>
);

4.0 wird die Methode der Einführung auf Anfrage übernehmen:

// Directly import
import SmileOutline from 'antd/icons/SmileOutline';

// If tree-shaking supported
import { SmileOutline } from 'antd/icons';

const Demo = () => (
  <div>
    <SmileOutline />
    <Button icon={<SmileOutline />} />
  </div>
);

Sie können die oben beschriebene kompatible Methode weiterhin verwenden.

Entfernen Sie Draft.js

Wir haben Draft.js in die Mention-Komponente eingeführt, um die Dropdown-Eingabeaufforderungspositionierungsfunktion zu implementieren, aber wir haben nur einen kleinen Teil ihrer Funktion verwendet. In Anbetracht der Kostenleistung erscheint es etwas verschwenderisch. Wir planen, die Abhängigkeit davon in 4.0 zu entfernen und stattdessen eine leichtere Lösung zu verwenden. Gleichzeitig werden wir zur Unterscheidung von Mention-Komponenten in 3.0 eine neue Komponente Mentions bereitstellen, um API-Konflikte zu vermeiden. In ähnlicher Weise unterstützt es auch die fortgesetzte Verwendung der oben genannten kompatiblen Methoden:

// Follow Code will not work
import { Mention } from 'antd';

const Demo = () => (
  <Mention />
);

// Added `Mentions` in 4.0
import { Mentions } from 'antd';

const Demo = () => (
  <Mentions />
);

🧭 Leistungsoptimierung

Während des Wartungsprozesses erhielten wir viele Leistungsdiskussionen über Big Data. Zu diesem Zweck planen wir auch eine Leistungsoptimierung.

Virtuelle Schriftrolle

Virtuelles Scrollen ist eine gängige Optimierungsmethode, aber aufgrund von Animationseffekten in Ant Design ist es nicht so einfach, das virtuelle Scrollen anzupassen. Jetzt planen wir, das virtuelle Scrollen in Komponenten mit Scrollen nativ zu unterstützen. Natürlich können wir nicht garantieren, dass alle Komponenten zum Zeitpunkt der Veröffentlichung von 4.0 aktualisiert wurden und weiterhin aktualisiert werden.

Animationsverbesserungen

In der Vergangenheit haben wir einige Hacks verwendet, um Animationen zu verarbeiten. In den meisten Szenarien funktioniert es recht gut. In 4.0 planen wir, dies anzupassen und den Hack-Ansatz für einen reaktiveren Pfad aufzugeben. Die Anpassung wird unbeaufsichtigt aktualisiert. Sie müssen keine Änderungen daran vornehmen.

🧩 Über Komponenten

In 3.0 haben wir weiterhin viele Komponenten hinzugefügt. In 4.0 werden wir fortfahren. Diese Komponenten werden anhand unserer Geschäftsszenarien, Ant Design Pro und Community-Anforderungen verfeinert. Dies ist ein fortlaufender Prozess. Das Hinzufügen neuer Komponenten ist der gleiche wie bei Ant Design 3.0. Wir werden die Entwurfsentwürfe verwandter Komponenten fällen und sie in der PR anzeigen und auf der offiziellen Website aktualisieren. Nach Abschluss der Entwicklung werden sie in der monatlichen Nebenversion veröffentlicht.

Darüber hinaus bereiten wir uns darauf vor, einige Schlüsselkomponenten zu überarbeiten, um die Entwicklung und Interaktion zu vereinfachen. Es umfasst, ist aber nicht beschränkt auf:

Formularkomponente

Das Publikum der Formularkomponenten ist sehr groß. Wir haben auch die Beschwerden der Community über die umständliche Formular-API bemerkt. In 4.0 hoffen wir, bessere API-Formulare zu untersuchen, um die Entwicklungskosten zu vereinfachen:

Das Formular aggregiert standardmäßig Formulardatenfelder, und Sie müssen keinen Kontext mehr über Form.create() erstellen.
Fom.Item aggregiert die Formularfelder standardmäßig. Sie müssen das Feld nicht über getFieldDecorator binden.
Der Wert von Form.Item bleibt immer erhalten, seine Validierungsfunktion wird jedoch nur wirksam, wenn das Formularelement sichtbar ist.

const Demo = () => {
  const [form] = Form.useForm();

  const onFinish = () => {
    // Do something...
  };

  useEffect(() => {
    // Something like ajax call
    form.setFieldsValue({
      username: 'light',
    });
  }, []);

  return (
    <Form form={form} onFinish={onFinish}>
      <Form.Item name="username" rules={[{ required: true }]}>
        <Input />
      </Form.Item>
    </Form>
  );
}

In der realen Szene sind wir auf die Szene der Multi-Form-Verknüpfung gestoßen (häufig in der detaillierten Konfiguration). Wir wissen, dass dies nicht bequem zu verwenden ist, daher werden wir auch die Funktion der Verknüpfung zwischen Formularen bereitstellen:

const { useForm, createContext } = Form;
const FormContext = createContext();

const Demo = () => {
  return (
    <FormContext>
      <YourForm1 />
      <YourForm2 />
    </FormContext>
  );
};

Wenn Sie den Fortschritt des Formulars folgen wollen, begrüßen die überprüfen Fortschritte .

Tabellenkomponente

In der vergangenen Version haben wir viele Rückmeldungen zur Table- Komponente erhalten. Wir wissen, dass die Erweiterungs- und Bildlaufeigenschaften von Table in der Vergangenheit nicht gut funktioniert haben. Dieses Mal konzentrieren wir uns auf die Lösung von Konflikten in diesem Bereich. Darüber hinaus werden wir die Leistung der Tabellenkomponente weiter optimieren. Und erkunden Sie einige einfachere Tabellenlayoutmethoden:

const Demo = () => {
  return (
    <Table
      header={{
        templateAreas: `
          name    address     address
          name    building    no
        `,
        cells: [
          { key: 'name', title: 'Name' },
          { key: 'address', title: 'Address' },
          { key: 'building', title: 'Building' },
          { key: 'no', title: 'No' },
        ],
      }}
    />
  );
};

antd4-table

Darüber hinaus planen wir, eine Zusammenfassungsfußzeile hinzuzufügen, um die

DatePicker erneuert

Der vorhandene DatePicker hat die meisten Anforderungen erfüllt, jedoch aus der Community-Diskussion . Wir haben immer noch die Möglichkeit, tiefer zu graben. Wir werden die verbleibenden Jahresselektoren und die entsprechenden Bereichsselektoren vervollständigen ( Diskussion ). Darüber hinaus werden wir den Stil der zugehörigen Datums- und Zeitauswahl anpassen, um die kognitiven Kosten der Benutzer weiter zu senken.

🚀 Kontinuierliche Aktualisierung

Zusätzlich zu den oben genannten Inhalten planen wir, einige Inhalte weiterhin zu aktualisieren. Dies wird in 4.0 weiterverfolgt, um die Benutzerentwicklung und die Benutzererfahrung besser zu verbessern.

🧶 Verbessern Sie die Barrierefreiheit

Ant Design 3.0 bietet keine Unterstützung für Barrierefreiheit. Aus diesem Grund planen wir, die Komponentenstruktur anzupassen und weitere Arien-Tags hinzuzufügen, um das Leseerlebnis auf dem Bildschirm zu verbessern. Darüber hinaus bereiten wir die Optimierung der vorhandenen Interaktionsmethoden für Komponententastaturen vor, um eine bessere vollständige Interaktion mit der Tastatur zu gewährleisten.

🎯 Entwickler-API-Spezifikation

Im Laufe der Evolution stellten wir fest, dass einige API-Stile mit anderen Komponenten nicht kompatibel zu sein scheinen. Für TypeScript-Benutzer ist dies kein Problem, für andere Benutzer kann es jedoch zu Speicherproblemen kommen.

Daher werden wir ein Standard-Benennungsdokument erstellen. Das Dokument enthält eine Liste der vorhandenen APIs und die entsprechenden Namenskonventionen. Wenn Sie neue Funktionen hinzufügen, werden diese auch gemäß dieser Spezifikation benannt. Um API-Abweichungen zu vermeiden, die in Zukunft auftreten können. Natürlich freuen wir uns auch über Feedback von Community-Studenten in der PR.

💼 Reagieren Sie auf den strengen Modus

Wenn Sie versuchen, <React.StrictMode> außerhalb der antd-Komponente zu verpacken, erhalten Sie viele Warnmeldungen von der antd-Komponente. Wir haben die Lebenszyklusmethoden einiger Komponenten in 3.0 aktualisiert. In 4.0 werden wir fortfahren.

💡 Verbessern Sie die Entwicklererfahrung

Im vergangenen Wartungsprozess haben wir festgestellt, dass bestimmte Probleme hin und her treten. Diese Probleme treten häufig in einigen Verwendungsspezifikationen oder Anwendungsszenarien auf. Zu diesem Zweck haben wir uns entschlossen, hier Verbesserungen vorzunehmen (tatsächlich haben wir uns seit 3.0 verbessert). In der Entwicklungsumgebung werden wir in der Konsole nach unerwarteten Situationen fragen (z. B. ungültige Moment-Objekte, Änderungen der Dom-Struktur, die durch die dynamische Anpassung des Eingabe-Präfixes / -Anhangs verursacht werden usw.). Wir sind davon überzeugt, dass die Konsole der erste Ort ist, auf den Entwickler bei Problemen achten. Wenn Sie hier entsprechende Hinweise geben, können Sie das Problem schnell lokalisieren. Zur gleichen Zeit für einige spezielle Anwendungen oder Szenarien. FAQs finden Sie in der entsprechenden Komponentendokumentation. Aus Sicht der Projektwartung kann unsere Energie keine detaillierten Antworten auf das Thema Nutzung geben. Diese Fragen sind jedoch real, insbesondere für Neulinge. Eine häufig gestellte Frage kann viel Suchzeit sparen. Wenn Sie interessiert sind, können auch freiwillige Community-Mitarbeiter zur Verbesserung der Entwicklererfahrung beitragen.

🐱 Asset Management verwalten

Ant Design ist nicht nur eine Reihe von Komponentenbibliotheken, sondern auch ein leistungsstarkes Designsystem dahinter. In 4.0 werden wir die neuesten designbezogenen Elemente (Sketch-Komponentenpaket, Küchenwerkzeugsatz, Design-Token usw.) aktualisieren, um Designern und Studenten, die sich für Design als Referenz interessieren, die Möglichkeit zu geben. Bestehende Designstile für Komponenten werden ebenfalls optimiert, um die visuellen Effekte und die Benutzererfahrung zu verbessern.

Zeitplan

Das Folgende ist unser Zeitplan, in dem einige Komponentenaktualisierungen ausgeführt werden. Wir werden verwandte Themen zu Github erstellen und freiwillige Helfer aus der Community zur Teilnahme einladen:

Q2

Markieren Sie die erforderliche veraltete API als veraltet und löschen Sie sie im Dokument.
Die zugrunde liegenden Komponenten sind vorgewärmt.

Q3

Richten Sie einen Antd 4.0-Zweig ein und aktualisieren Sie die Dokumentation.
Entwicklung von Komponenten auf niedriger Ebene.

Q4

Release 4.0 Version.

Willkommen zur Teilnahme

Während des 4.0-Entwicklungsprozesses kann der oben genannte Inhalt angepasst werden. Begrüßen Sie Community-Studenten, um wertvolle Ideen und Vorschläge zu liefern. Lassen Sie uns Ant Design 4.0 bequemer und benutzerfreundlicher gestalten!

4.x ✨ Announcement 🕙 Plan 🗣 Discussion

Quelle

zombieJ

👍261 🎉63 ❤59 🚀47 😄34 👀2

Hilfreichster Kommentar

15311

Werden wir Moment.js in Version 4 ersetzen?

hk-ng am 1. Juni 2019

👍101 ❤13

Alle 182 Kommentare

15311

Werden wir Moment.js in Version 4 ersetzen?

hk-ng am 1. Juni 2019

👍101 ❤13

Großartig, ich kann es kaum erwarten, ein Upgrade durchzuführen

lcoder am 1. Juni 2019

V4 Alpha vorbereiten

Hauptsächlich Ziel

[x] v4-Zweig
[x] Kompatibles Paket
[x] Veralteten Inhalt entfernen
- [x] Komponente erwähnen
- [x] Neue Erwähnung Komponente # 16532
- [x] Form.create
- [x] Symbol mit type # 12011
- [x] Andere mit veralteten Warnrequisiten
[x] Weniger v3
[x] Leistung
- [x] rc-animate Upgrade
- Unterstützung für [x] gleichzeitigen Modus
- [x] Unterstützung für virtuelle Bildlaufanimationen
- [x] Virtuelle Schriftrolle
- [x] RC-Komponente
- [x] Baum
- [x] Wählen Sie
- [x] TreeSelect
- [x] Formular: https://github.com/react-component/form/pull/292
- [x] Stellt die Hooks-Version bereit
- [x] Tabelle
- [] templateAreas
- [x] Unterstützung von expand & scroll Zusammenarbeit
[x] DatePicker mit neuem Design
- [x] YearPicker
- [x] RangePicker.YearPicker
- [x] RangePicker.MonthPicker
- [x] RangePicker.YearMonthPicker
- [x] RangePicker.WeekPicker
- [x] TimePicker.RangePicker

Ziel fortsetzen

[ ] Barrierefreiheit
[x] API-Standard
[] React.StrictMode

afc163 am 1. Juni 2019

👍1

Hier sind einige Vorschläge zu Ant 4

Über `templateAreas`

templateArea analysiert die Zeichenfolge zur Laufzeit und verursacht beim Tippfehler der Zeichenfolge nicht erwartete Analysefehler oder Fehler. Das Parsen zur Laufzeit ist auch für TypeScript unfreundlich. Würde Ant Team den folgenden Vorschlag prüfen:

const columnTemplate = [
  ['name', 'address', 'adress'],
  ['name', 'building', 'no']
]

Über Abhängigkeit

Würde Ant Team in Betracht ziehen, die Abhängigkeit von moment beseitigen?

Moment ist zu groß für ein Front-End-Projekt, es gibt viele Alternativen, aber die Requisiten von TimePicker und DatePicker basieren auf Moment. Es führt dazu, dass wir moment durch date-fns oder eine andere Bibliothek ersetzen können, die kleiner als Moment ist.

Über Icon

Ich denke, die Art und Weise, wie Ant-Symbole jetzt verwendet werden, sollte nicht veraltet sein. Die neue Art und Weise, wie das Importsymbol beim Hinzufügen oder Entfernen eines Symbols zu allgemeinen Änderungen an Bundle-Chunks führen kann.

Ant Team kann zwei Möglichkeiten zur Verwendung von Ant-Symbolen bereitstellen:

Packen Sie alle Symbole in eine JS-Datei. Entwickler können die gesamte Datei <script> Tag externals im Webpack festlegen.
Der neue Weg, der oben einführt.

4 是我对 Ant4 的一些建议

关于`templateAreas`

templateAreas Script 运行时对字符串进行解析，当字符串出现拼写错误的时候， Script Script Script Script Script TypScript 对 ScriptAnt 团队 nt nt ：：

const columnTemplate = [
  ['name', 'address', 'adress'],
  ['name', 'building', 'no']
]

关于依赖

是否考虑移除对 Moment 的依赖？

Moment对于前端项目来时实在是太大了,市面上有许多可供替代的库,但是TimePicker和DatePicker的参数依赖于Moment对象,这导致了我们没办法使用date-fns或者一些比 Moment 更小的库来替代 Moment。

关于图标

使用认为当前使用 Ameise 图标的方式不应该被废弃。新的使用方式在我新增或者删除图标 unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk unk

Ameise 使用可以提供如下两种方案来使用 Ameise ：：

Pack 所有图标到 s js 文件中，开发<script>标签 pack 全部图标， pack pack Webpack 中设置externals
4,0 新介绍的图标使用使用

jas0ncn am 1. Juni 2019

👍47

Gibt es einen Plan zur Unterstützung des virtuellen Bildlaufs für Tabellen? In einigen Fällen wird eine unendliche Tabelle der Paginierung vorgezogen.
Und da 'Kommentar' in 3.11 enthalten ist, vielleicht ChatBox und ChatMessage?

ifiknew am 2. Juni 2019

👍10

Gibt es einen Plan zur Unterstützung des virtuellen Bildlaufs für Tabellen? In einigen Fällen wird eine unendliche Tabelle der Paginierung vorgezogen.
Und da 'Kommentar' in 3.11 enthalten ist, vielleicht ChatBox und ChatMessage?

UserInfo vielleicht Prioritäten.

jas0ncn am 2. Juni 2019

ungefähr `templateAreas`

Ich unterstütze auch die Syntax von zweidimensionalen Arrays
Ich unterstütze auch die Syntax von zweidimensionalen Arrays.

In Bezug auf templateAreas finden Sie hier ein Beispiel für die statische Überprüfung
Dies ist ein Beispiel für eine statische Typprüfung mit ts für templateAreas

interface Cell<T extends string = string> {
  key: T;
  title: string;
}

interface Config<K extends string = string> {
  header: {
    templateAreas: ReadonlyArray<ReadonlyArray<K>>;
    cells: ReadonlyArray<Cell<K>>
  };
}


declare function check<T extends string>(config: Config<T>): void;

const config = {
  header: {
    templateAreas: [
      ['name', 'address', 'address'],
      ['name', 'building', 'error'],
    ],
    cells: [
      { key: "name", title: "Name" },
      { key: "address", title: "Address" },
      { key: "building", title: "Building" },
      { key: "no", title: "No" }
    ]
  }
} as const;

check(config);

Spielplatz

muzea am 2. Juni 2019

👍3 🚀1 😕1 🎉1 😄1

genial

Huanglei2010 am 3. Juni 2019

15311
Werden wir Moment.js in Version 4 ersetzen?

Ich denke, das Hauptproblem bei der Abkehr von moment ist die Veränderung um locale s. https://github.com/ant-design/ant-design/issues/15311#issuecomment -471383811

zachguo am 4. Juni 2019

Hoffe, die Unterstützung für Typoskript kann besser sein

fwh1990 am 5. Juni 2019

👎2

Tolles Sehen 4.0 ist in Arbeit! Ich habe unten einige Vorschläge zur Prüfung, ich bin nicht ganz sicher, ob sie in das Designmuster passen, aber für die Anpassbarkeit wären sie meiner Meinung nach großartig.

In der Lage sein, die Hintergrundfarbe einer Zeile innerhalb von <Table> zu steuern. Färben Sie beispielsweise eine Zeile orange, um die Warnung für diese Zeile hervorzuheben.
Tastenfarben, habe keine vorherigen Diskussionen dazu gefunden. Aber es wäre großartig, eine ähnliche API wie <Tag color="red">RED<Tag /> für Schaltflächen zu haben, zum Beispiel <Button color="red">Red Button<Button/> .
Unterstützung für Font-Awesome 5.x-Symbole in den verschiedenen Komponenten oder Sicherstellen, dass sie mit den anderen Symbolen funktionieren, die noch ausgeführt werden. Ich habe einige Probleme bei der Ausrichtung festgestellt, wenn FA anstelle der nativen <Icon> -Komponente verwendet wurde.
Die <Pagination> -Komponente unterstützt nicht die direkte Bereitstellung der Seitenanzahl. Der Anwendungsfall besteht darin, dass mir beispielsweise nur die Seitenanzahl und die aktuelle Seite zur Verfügung stehen, nicht jedoch die Anzahl der Elemente auf jeder Seite. Ich habe noch keinen guten Weg gefunden, damit umzugehen.

orecus am 5. Juni 2019

@orecus

Färben Sie beispielsweise eine Zeile orange, um die Warnung für diese Zeile hervorzuheben

Ich neige dazu, rowClassName zu verwenden, um eine Klasse an diese Zeile anzuhängen und dann den Standardstil mit CSS zu überschreiben.

DasKomponente unterstützt nicht die direkte Bereitstellung der Anzahl der Seiten

Kann eine gefälschte Summe passieren. Wenn Sie beispielsweise 50 Seiten möchten, können Sie total = pageSize * 50 .

muzea am 5. Juni 2019

Das sind wirklich gute Nachrichten. 🚀 Der Fokus auf die Leistung ist sichtbar und das ist großartig, da einige Komponenten nicht mit großen Datenmengen verwendet werden können.

Wie möchten Sie Virtual Scroll implementieren? Verwenden Sie react-window ?

Gibt es Prioritäten für Hauptzielfunktionen?
Ich würde gerne Virtual Select in der Alpha-Phase ausprobieren und ich denke, ich bin in dieser Hinsicht nicht allein.

Vielen Dank.

bend-up am 5. Juni 2019

👍6

Warum kann der Stringname nicht bei Bedarf geladen werden? Löst Lazy () nicht das Problem?

faradaytrs am 6. Juni 2019

@faradaytrs
Ja, aber es hängt von den Eigenschaften von webpack , bestimmten Operationen

Zwei Probleme sind stärker ausgeprägt

/* webpackChunkName: "icons/icon-" */ geschrieben von webpack Magic Comments
Wie im Original gesagt: "Jedes Symbol enthält zusätzlich zum Symbolinhalt zusätzliche Informationen zum Webpack-Modul."

muzea am 6. Juni 2019

👎1

Irgendwelche Ideen zur globalen Verschmutzung? # 4331 # 9363

wangjianio am 9. Juni 2019

👍30 😕3

Irgendwelche Ideen zur globalen Verschmutzung? # 4331 # 9363

Meiner Meinung nach wäre es für 4.0 großartig, Benutzern zu ermöglichen, Antdesign-Stile unter einem globalen Namen zu erfassen (siehe meinen Kommentar https://github.com/ant-design/ant-design/issues/4331#issuecomment-396047487).

abenhamdine am 9. Juni 2019

👍6

Schön, vom nächsten Meilenstein zu hören!

Meine 2 Ct. in Bezug auf Dokumente und Rationalisierung:

Es werden häufig Requisiten an die zugrunde liegenden DOM-Elemente übergeben, die nicht dokumentiert sind (IIRC In einigen Fällen werden alle Requisiten, die nicht von der Komponentenimplementierung ausgewählt wurden, weitergeleitet). Es wäre sehr hilfreich, sie dokumentieren zu lassen, gruppiert nach Zielelementen (es kann mehr als eines geben): "Die folgenden Requisiten werden an den Container weitergeleitet

"oder" Die folgenden Requisiten werden durch die Element ... "oder" Alle anderen Requisiten werden an ... übergeben. "Für diese Requisiten ist keine ausführliche Erläuterung erforderlich. Links zu MDN können ausreichend sein.

Eine solche Änderung wäre auch für uns TypeScript-Entwickler von Vorteil. Derzeit ist es eine Menge mühsamer Arbeit, die TS-Definition in dieser Hinsicht auf dem neuesten Stand zu halten.

Im "Developer API Standard" sollte dies dokumentiert werden und es sollte eine Entscheidung getroffen werden, welche Requisiten immer übergeben werden sollen (className, id ,?)

sbusch am 11. Juni 2019

Eine andere Frage:

Planen Sie, weitere Dateien (oder sogar RC-Komponenten) von JavaScript mit TypeScript-Definitionen auf natives TypeScript umzustellen?

sbusch am 11. Juni 2019

Ersetzen Sie rc-form durch etwas Flexibleres wie Formik.

iamvanja am 12. Juni 2019

👎7 👍6

Frage an die Betreuer:

Mein Team ist daran interessiert, Ant auszuprobieren, aber https://github.com/ant-design/ant-design/issues/11097 (Antd Less erzeugt globale JavaScript-Lecks) blockiert uns. Die obige Roadmap besagt, dass Ant auf WENIGER Version 3 umsteigen wird, und ich habe gelesen, dass die betreffende unsichere, veraltete Inline-JavaScript-Funktion standardmäßig deaktiviert ist. Bedeutet dies, dass Ant Version 4 das Problem WENIGER nicht mehr hat?

kaiyoma am 15. Juni 2019

👍5

Nicht nur IE9 / 10, sondern auch die IE-Unterstützung beenden,

wanliyunyan am 19. Juni 2019

👍6 🎉5 😄5 👎4

Oh Gott, es wäre so nützlich, globale Stile nicht zu verschmutzen ( html , body , *::before , ...)

and-semakin am 20. Juni 2019

👍10

Ein auf React-Slick basierendes Karussell hat viele Probleme bei der Verwendung. Es wird empfohlen, die neue Version durch eine andere Bibliothek zu ersetzen
React-Pannable ist ziemlich gut zu bedienen

cztflove am 26. Juni 2019

👎1 👍1

Die Beschreibung der Commits von @cztflove dieser Bibliothek ist alles no message 😃, und die Aufmerksamkeit der Community ist zu gering, ich sollte es nicht berücksichtigen.

yoyo837 am 26. Juni 2019

@ yoyo837 Hauptsächlich ist diese Komponente neu, daher ist die Aufmerksamkeit relativ gering, aber sie unterstützt virtual list und 仿ios边缘弹性 , basierend auf dieser Komponente können auch einige 拖拽 -Funktionen realisiert werden 🤔 In Zukunft gibt es mehr Raum für Expansion

cztflove am 26. Juni 2019

👍2

Sollten wir nicht in eine universelle Sprache migrieren?

Ich stimme den regionalen Sprachen voll und ganz zu und respektiere sie, auch wenn ich kein englischer Muttersprachler bin. Es gibt Hunderte von sich wiederholenden oder besser gesagt doppelten Aufgaben mit doppelter Sprache. Der wichtigste Faktor ist vor allem die Zeit, die Übersetzung der besprochenen Zeichenfolgen, das Lernen aus der Dokumentation oder den Tuts. Demos etc.

Ich muss zugeben, es gibt keinen Mangel an Mitwirkenden aufgrund von Sprachkonflikten, dennoch haben Hunderte von uns Angst, sich zu engagieren. Es gibt bereits viele Sprints, Probleme bei der Übersetzung, aber ich bitte Sie, mit dieser Hauptversion vollständig auf eine universelle Sprache zu migrieren, um die Kommunikationslücke zwischen uns allen zu

asharamseervi am 29. Juni 2019

👍8 😕1

Sollten wir nicht in eine universelle Sprache migrieren?
Ich stimme den regionalen Sprachen voll und ganz zu und respektiere sie, auch wenn ich kein englischer Muttersprachler bin. Es gibt Hunderte von sich wiederholenden oder besser gesagt doppelten Aufgaben mit doppelter Sprache. Der wichtigste Faktor ist vor allem die Zeit, die Übersetzung der besprochenen Zeichenfolgen, das Lernen aus der Dokumentation oder den Tuts. Demos etc.
Ich muss zugeben, es gibt keinen Mangel an Mitwirkenden aufgrund von Sprachkonflikten, dennoch haben Hunderte von uns Angst, sich zu engagieren. Es gibt bereits viele Sprints, Probleme bei der Übersetzung, aber ich bitte Sie, mit dieser Hauptversion vollständig auf eine universelle Sprache zu migrieren, um die Kommunikationslücke zwischen uns allen zu verringern.

说得对，专心说说中文

faradaytrs am 30. Juni 2019

👍2

Frage an die Betreuer: Gibt es Pläne, CSS-Variablen zum Ändern von Farb- und Stilthemen während des Flugs zu verwenden?

In der Praxis habe ich gelernt, dass das Ändern von Komponentenstilen durch Variablen ein sehr komfortabler Weg ist. Ich habe versucht, weniger Variablen mit var(--css-vars) umzuschreiben, aber ich habe viele Fehler beim Kompilieren von Stilen festgestellt, da viele Stile Funktionen und Operationen mit Variablen verwenden, nicht nur Werte. Ich nehme an, dass es eine große Aufgabe ist und auf diese Weise wichtige Änderungen erstellt werden, aber Hauptversionen wurden erstellt, um Änderungen zu ändern :) Und die Verwendung von CSS-Variablen bietet viele Möglichkeiten zur Anpassung von Komponentenstilen.

Was denkst Du darüber? Ich habe ohnehin geplant, ein Thema mit CSS-Vars als Pull-Anfrage zu entwickeln, da diese Funktion (Ändern des Themas während des Flugs) in meinem Projekt benötigt wird.

Entschuldigung, wenn dieser Vorschlag doppelt vorhanden ist, aber ich habe in anderen Ausgaben und PRs nichts darüber gefunden.

Z3SA am 2. Juli 2019

@ Z3SA https://caniuse.com/#search = CSS% 20Variables. Dies muss die gesamte IE-Unterstützung beenden. Die Beendigung der IE11-Unterstützung ist zu radikal, obwohl ich dies auch unterstütze.

yoyo837 am 2. Juli 2019

@ yoyo837 , ich stimme zu, dass es zu radikale Ursache für IE-Support-Probleme ist. Aber auch Ant Design hat offizielle Unterstützung (wie auf ant.design angegeben) von Electron (als separate Plattform, nicht als Web). In diesem Fall kann es möglich sein, zwei Themen zu erstellen: eines mit weniger Variablen und eines mit CSS-Variablen. Aber es scheint zu schwer zu unterstützen.

Also, eine andere mögliche Strategie, die ich annehme - Erstellen Sie weniger Variablen für alle anpassbaren Attribute in Less oder entfernen Sie die Verwendung von Funktionen und Operationen unter weniger Variablen, die jeder Entwickler als Eintrag für seine CSS-Variablen verwenden kann. Oder wenn Sie es einfacher sagen - verwenden Sie Less vars nur als Wertecontainer, nicht für Funktionen und Operationen.

Z3SA am 2. Juli 2019

Wenn nur große Browser unterstützt werden, glaube ich, dass die Größe des Codes kleiner und der Code einfacher zu warten ist.

wanliyunyan am 3. Juli 2019

👍2

Nicht nur IE9 / 10, sondern auch die IE-Unterstützung beenden,

@wanliyunyan Zu brechen. Einige Entwickler halten sich möglicherweise an antd @ 3 und es ist keine gute Sache für uns.

dancerphil am 3. Juli 2019

@ Z3SA Das wird eine große Arbeit.

yoyo837 am 3. Juli 2019

@dancerphil Zum Glück betrachte ich für mein Projekt nur die neueste Version von Chrome. 😃 Ich hoffe also, je kleiner die Größe, desto besser.

wanliyunyan am 3. Juli 2019

@ yoyo837 Ich weiß es. Und ich werde es selbst tun, wenn diese Idee nicht genug Aufmerksamkeit bekommen könnte.

Z3SA am 3. Juli 2019

Wir sind ein Unternehmen, das gerne mithilfe einzelner Komponenten schrittweise auf antd migrieren würde. Die Verwendung globaler Stile durch ant erschwert dieses Problem jedoch erheblich. Bitte hören Sie auf, globale Stile zu verschmutzen.

jmackay-hippocmms am 6. Juli 2019

👍6

Form ist eine der am häufigsten verwendeten Komponenten. Wir stellen fest, dass Social Media viele Kommentare zum API-Design hat. Wir möchten die API in 4.0 vereinfachen:

Fom.Item enthält Feldbindung.

Können wir mit diesen Änderungen Form.Item weiterhin als reine Präsentationskomponente verwenden? Ich liebe die Komponenten von antd, aber ich bevorzuge die React-Final-Form für das State Management. Ich möchte den Stil von Form.Item und keine der Zustandsverwaltungslogiken.

jmackay-hippocmms am 6. Juli 2019

👍3

Zweig 4.0 wird erstellt. Wann kann ich eine Vorschau anzeigen?

jeessy2 am 10. Juli 2019

Die neue Formularkomponente ist fantastisch!

fxxjdedd am 16. Juli 2019

👍4

Bitte ersetzen Sie momentjs durch dayjs, da momentjs sehr groß ist und die Bundle-Größe ebenfalls sehr groß wurde.

ViktorAksionov am 17. Juli 2019

👍24

Gibt es Fallstricke bei der Übernahme des Rich-Text-Editors?

XUANLANcognition am 18. Juli 2019

Was ist das Erscheinungsdatum?

rafaelodassi am 19. Juli 2019

@rafaelodassi Es gibt noch kein bestätigtes Datum, aber wahrscheinlich im vierten Quartal.

ztplz am 21. Juli 2019

🎉1

Ein Upgrade auf @babel/runtime@7 und core-js@3 wäre ebenfalls unsere Priorität.

afc163 am 22. Juli 2019

🎉3

Nicht v3? Gibt es Neuigkeiten für core-js@4 ?

yoyo837 am 22. Juli 2019

😄1

Alle reden davon, die IE-Unterstützung insgesamt zu entfernen, da die Statistiken zeigen, dass sie kaum verwendet wird. Wie wäre es mit den Millionen von Unternehmensbenutzern hinter dem Intranet, die überhaupt nicht in die Statistiken gelangen? Sie bleiben aufgrund der Unternehmensrichtlinien bei IE10 und IE11 hängen.

Ich werde bei antd @ 3 bleiben, wenn die IE11-Unterstützung eingestellt wird. Das Löschen von IE10 kann von den meisten Clients akzeptiert werden, da es von MS nicht mehr unterstützt wird und Unternehmens-PCs auf IE11 aktualisiert werden.

filipjnc am 23. Juli 2019

👍10 👎4

Ich würde vorschlagen, eine API einzuführen, um die Verwendung von Objekten als <Select/> -Werte zu ermöglichen.
Details finden Sie unter https://github.com/ant-design/ant-design/issues/13485

cc @zombieJ

SergeyVolynkin am 25. Juli 2019

Es wird empfohlen, dass jede Komponente über ein eigenes Aktualisierungsprotokoll verfügt. Es spielt keine Rolle, ob Sie es versteckt halten, persönlicher Vorschlag ~

redclown am 27. Juli 2019

👍1

Wann kann Release oder RC möglich sein?

fwh1990 am 27. Juli 2019

👍1

Es wird empfohlen, dass jede Komponente über ein eigenes Aktualisierungsprotokoll verfügt. Es spielt keine Rolle, ob Sie es versteckt halten, persönlicher Vorschlag ~

Stimmen Sie zu, ob die Dokumentation jeder Komponente mit welcher Version hinzugefügt werden kann. Andernfalls können Sie in der Dokumentation nachsehen, ob die aktuelle Version verwendet werden kann und ob die Abhängigkeiten aktualisiert werden sollen.

_{Gesendet mit GitHawk}

jas0ncn am 28. Juli 2019

@ fwh1990 @ jas0ncn @redclown
auf Englisch pls)

akaguny am 29. Juli 2019

👍7

Behalte es als englischen Kanal, danke ~

ztplz am 30. Juli 2019

👍2

4.0 Alpha wurde veröffentlicht. Das ist erstaunlich. Komm schon Bruder.

Ich werde mein Projekt umgestalten, sobald Sie die Beta- Version veröffentlichen

fwh1990 am 31. Juli 2019

👀1

Das Standardthema von antd ist wunderschön, kann aber auch besser sein.
Berücksichtigen Sie zur besseren Lesbarkeit den verbesserten Kontrast und verwenden Sie größeren Text.

Es gibt so viele Artikel und Werkzeuge.
https://www.google.com/search?q=web+readability

Airkro am 1. Aug. 2019

❤1

Es ist besser, ein Skript für die Migration von antd v3 nach v4 bereitzustellen.

Im biz-Projekt sind zu viele Formularkomponenten vorhanden. Die Migration von antd v3 nach v4 kostet zu oft.

Das react-relay Team hat etwas Ähnliches getan.
Wenn Sie react-relay v3 auf React-Relay v4 Realease migrieren möchten , müssen Sie viele Dateien ändern.
Daher verwenden sie jscodeshift , um ein Migrationsskript zu schreiben, sodass der Benutzer von react-relay react-relay v3 leicht auf v4 migrieren kann.

xyy94813 am 1. Aug. 2019

👍2

Ich finde es schwierig, einige der Stile zu verdrahten. Also, wenn es einen Plan gibt, das zu verbessern?

Ich persönlich bevorzuge die Verwendung von CSS-in-JS, es ist sehr flexibel und passt unglaublich gut zu React.

FuJuntao am 2. Aug. 2019

👍5

Bei Verwendung einer Klassenkomponente unter 4.0 Alpha kann die Formularentität nicht abgerufen werden. Https://5d403395cd145c0008eea971--ant-design.netlify.com/components/form/v3-cn Der Beispielcode unter diesem Link kann nicht implementiert werden, und es gibt keine Entität in formRef Methode

Es wurde gelöst

Kwei9 am 6. Aug. 2019

@ Kwei9 , können Sie ein Problem öffnen und zur Reproduktion anhängen?Lass mich mal sehen

zombieJ am 6. Aug. 2019

@ Kwei9 , können Sie ein Problem öffnen und zur Reproduktion anhängen?Lass mich mal sehen

Das Ref-Schreiben wird auf diese Lösung geändert

Kwei9 am 6. Aug. 2019

Ich denke, jetzt wäre die Zeit gekommen, um die globale Umweltverschmutzung anzugehen! Dies macht es sehr notwendig, antd neben anderen Anwendungen zu verwenden!

ChuckJonas am 7. Aug. 2019

👍16 ❤4 👎1

Moment ist zu groß für ein Front-End-Projekt, es gibt viele Alternativen, aber die Requisiten von TimePicker und DatePicker basieren auf Moment. Es führt dazu, dass wir den Moment nicht ersetzen können ...

@ jas0ncn Hallo, bitte erwäge, momentjs durch dayjs zu ersetzen (eine 2-KB-Alternative). Dies ist bereits eine getestete Ausgabe von Replace Moment.js in Ant Design (Antd) durch Day.js https://github.com/iamkun/dayjs/issues/529 und funktioniert sehr gut.

Als Hauptbetreuer von dayjs sind wir bereit, Ihnen bei diesem Ersatz behilflich zu sein.

Vielen Dank.

J 考虑使用轻量 j Dayjs 来替换 moment.js ps 在这里已经充分测试过替换的https://github.com/iamkun/dayjs/issues/529 。

xxyuk am 8. Aug. 2019

👍34 ❤12

Die alte Art der Verwendung von Symbolen wird * veraltet *:
import { Icon, Button } from 'antd';

const Demo = () => (
  <div>
    <Icon type="smile" />
    <Button icon="smile" />
  </div>
);
Verwendet stattdessen ein einzelnes Importsymbol in 4.0:
// Directly import
import SmileOutline from 'antd/icons/SmileOutline';

// If tree-shaking supported
import { SmileOutline } from 'antd/icons';

const Demo = () => (
  <div>
    <SmileOutline />
    <Button icon={<SmileOutline />} />
  </div>
);
Ich habe eine Idee zu der neuen Symbolreferenz. Aufgrund des neuen Wortlauts oben entspricht jedes Symbol einer separaten Komponente. Beispielsweise kann die Einführung eines Ladesymbols folgendermaßen aussehen:

import Loading from 'antd/icons/Loading';

<Loading />

Aber normalerweise können Sie eine echte Ladekomponente selbst kapseln, und in der Vergangenheit wusste <Icon /> , dass es sich auf einen Blick um ein Symbol handelt, aber jetzt nimmt es zu viele Namen an, und ich möchte wissen, dass das Symbol nach oben gehen muss, um den Importort zu finden.
sowie:

<Title />
<Loading />
<Sun />

Auf den ersten Blick scheinen die folgenden beiden nicht als Symbole zu sehen zu sein (natürlich hat dies keine Auswirkungen auf die Ausführung des Codes ~)
Wenn Sie zum folgenden Wortlaut wechseln:

 import {Icon} from 'antd';
 import {Loading, Sun} from '@antd/icons';  

<Icon spec={Loading}  {...otherProps}/>
<Icon spec={Sun} />

Durch die äußere Schicht des Musters sieht es dem vorherigen sehr ähnlich und kann auch bei Bedarf verwendet werden. Es ist nichts weiter als die Einführung einer Icon-Komponente.
Und wenn bestimmte Konventionen erfüllt sind, kann ein benutzerdefiniertes Symbol über das Attribut spec übergeben werden. Es ist gleichbedeutend mit antd, das hilft, viele Symbole im Voraus zu definieren, aber die benutzerdefinierten sind genau die gleichen ~~~

ps: Oder ist es so, dass an diese Art des Schreibens schon vor langer Zeit gedacht wurde oder nicht darüber nachgedacht wurde, weil es ein Problem mit dieser Art des Schreibens gibt? . . 😂
Ich habe nur darüber nachgedacht. . .

ppbl am 14. Aug. 2019

👍4

@ppbl ähnelt Ihrer Vorstellung nach wie folgt:

import Icon from '@antd/icons'; 
imoort { LoadingOutline } from '@antd/icons-svg';

<Icon component={LoadingOutline}  {...otherProps}/>

Das neue Symbol wird ebenfalls auf ähnliche Weise generiert (siehe https://github.com/ant-design/ant-design-icons/blob/master/packages/icons-react/src/icons/AccountBook.tsx)

Können wir diese Situation vermeiden, indem wir dem Namen des Symbols ein Symbolpräfix / -suffix hinzufügen?

imoort { LoadingOutlineIcon } from '@antd/icons';

<LoadingOutlineIcon  {...otherProps}/>

vagusX am 14. Aug. 2019

👍1

Bitte arbeiten Sie an der Reduzierung der Bundle-Größe
https://github.com/ant-design/ant-design/issues/9419
Beim Importieren von Button dem Projekt 95 KB hinzugefügt - das ist 2019 einfach nicht akzeptabel. 👎

avalanche1 am 14. Aug. 2019

😕1

@vagusX Vielleicht denke ich nur, dass der Name ein bisschen lang ist? Ich denke immer, dass der Name prägnant ist und wie eine kleine Komponente oder eine relativ einzelne Komponente aussieht. Der Name ist zu lang und sollte eine große Komponente sein (natürlich ist dies ein falsches Gefühl ~ ich weiß). . ~

Wenn ich weiß, dass es sich um ein Symbol handelt, nur um <Icon /> , kann ich natürlich auch selbst eine <Icon /> -Komponente erstellen und dann das Antd-Symbol umschließen, wenn ich es verwende. Der Effekt ist fast der gleiche. ~ Ich habe nur das Gefühl, dass sie alle Symbole sind, und es sind wirklich ein paar verstreute Namen. Es fühlt sich ein bisschen seltsam an. Der Unterschied ist, dass ich wusste, dass es zuerst ein Symbol war und dann wusste ich, um welchen Typ es sich handelt. Jetzt kenne ich zuerst den Typ, dann weiß ich, oh, es ist ein Symbol ~

ppbl am 14. Aug. 2019

@ avalanche1 Sie können sich das Ergebnis der Bundle-Analyse unter https://github.com/ant-design/ant-design/pull/18217#issuecomment -520683838 und die Größe der Komponente Button ansehen lehnt deutlich ab

vagusX am 14. Aug. 2019

Gut zu wissen. Aber auf Ihren Screenshots gibt es keinen Hinweis auf die tatsächliche Größe, so dass ich weder bestätigen noch widerlegen kann.

avalanche1 am 15. Aug. 2019

Ich werde Form auf neue APIs migrieren, aber ich habe festgestellt, dass die Version von field-form instabil ist. Daher möchte ich wissen, ob es in Zukunft zu Änderungen an diesen Schnittstellen kommen wird.

orzyyyy am 16. Aug. 2019

@orzyyyy ,
und veröffentlichen Sie die 4.0-alpha.x -Version für soziale und interne Freiwillige, um sie zu testen. Wenn keine negative Rückmeldung von der Alpha-Version vorliegt, ist diese API die letzte bei Veröffentlichung.

zombieJ am 16. Aug. 2019

👍3

@ avalanche1 @ant-design/icons v4-alpha-Version unterstützt das Schütteln von Bäumen. Die Größe des Bundles hängt also davon ab, wie viele Symbole Sie in Ihrem eigenen Projekt verwendet haben, ob Sie eine antd-Komponente verwenden, die Symbole intern importiert, oder ob Sie @ant-design/icons direkt, also konnte ich Ihre Besorgnis über diesen Punkt vielleicht nicht verstehen.

vagusX am 16. Aug. 2019

Warum sprechen wir über Symbole, als mein erster Beitrag über Schaltflächen, Kalender und andere Komponenten war? https://github.com/ant-design/ant-design/issues/9419

avalanche1 am 16. Aug. 2019

DatePicker Wert muss Moment sein, kann Moment entfernt werden? Wenn ich das von aktualisiere, muss ich in Moment konvertieren

jeessy2 am 18. Aug. 2019

👍2

Für die moment ist hier meine Überlegung. DatePicker verwendet standardmäßig immer noch moment da Kompatibilitätsanforderungen bestehen, bietet jedoch die Factory-Funktion zum Erstellen mit anderen Datumsbibliotheken:

import DatePicker, { createPicker } from 'antd/lib/date-picker';

import dayjs from 'dayjs';

const basicDemo = <DatePicker />

const MyDatePicker = createPicker(dayjs, {
  // Some proxy function, maybe can provided by default...
  format(dayObj, formatStr) {
    return ...;
  },
  parse(str, formatStr) {
    return ...;
  },
});

const dayDemo = <MyDatePicker />;

Ich dachte nur, willkommene Diskussion.

zombieJ am 19. Aug. 2019

👍6

Jetzt ist die Zeit gekommen, moment.js loszuwerden!

Moment.js wird aufgrund seiner komplexen OOP-API niemals baumschüttelnd sein . (Sie müssten es von Grund auf neu schreiben). Es ist ein enormer Aufwand für Antd und Benutzer.
Ant Design v4 ist eine Hauptversion mit bahnbrechenden Änderungen. Jetzt ist die Zeit!
Ich schlage vor , es nicht mit einer anderen Bibliothek zu ersetzen. Antd verwendet möglicherweise intern etwas Kleines wie dayjs oder date-fns , sollte jedoch native Date Objekte oder Zeichenfolgen für seine Komponenten akzeptieren .

Jedes Mal, wenn Sie moment() anrufen, stirbt ein

:Hund:

onury am 21. Aug. 2019

👍38 👀1 ❤1 👎1

@zombieJ möchte wissen, wie sich die Tabellenkomponente entwickelt. Gibt es eine Vorschau-Version wie Form? Insgesamt hätte ich fast Blut erbrochen

Liu-Ya am 21. Aug. 2019

Enthält die Alpha-Version bereits die neue Tabelle? Wenn ja, sollte die Vorschau-Website ein Beispiel dafür enthalten?

ArthurBrito am 21. Aug. 2019

Die Tabelle befindet sich in der Warteschlange. Derzeit arbeite ich an der virtuellen Liste.

zombieJ am 21. Aug. 2019

👍9 ❤4

Was ist mit der Unterstützung für gestylte Komponenten?

khryshyn am 24. Aug. 2019

👎3 👍1

Form initialValues setzen nicht moment . https://github.com/react-component/field-form/blob/master/src/interface.ts#L7

hengkx am 24. Aug. 2019

👍1

Ich hoffe, dass Form eine unkontrollierte Version bereitstellen kann, um das Leistungsproblem großer Formulare wie Excel zu lösen

zoffyzhang am 26. Aug. 2019

Gibt es eine Chance, dass die Alpha-Dokumentation auf die reguläre Ant-Dokumentationsseite verschoben wird?

Mein Arbeitgeber blockiert Netlify-Domains und ich gehe davon aus, dass dies auch andere tun könnten.

hannaofsweden am 4. Sept. 2019

👍1

Gibt es einen konkreten Plan zur Unterstützung der Tastaturbedienung über Menü und Dropdown?

wattlebird am 9. Sept. 2019

Gibt es eine Chance, dass die Alpha-Dokumentation auf die reguläre Ant-Dokumentationsseite verschoben wird?
Mein Arbeitgeber blockiert Netlify-Domains und ich gehe davon aus, dass dies auch andere tun könnten.

Warum? lol

lu-zen am 10. Sept. 2019

Es ist zu hoffen, dass die Tabellenkomponente der Tabellenkomponente des Elements ähnelt. Jede Spalte legt automatisch zuerst eine Breite fest. Es wird empfohlen, das Kopfzeichen der Tabelle in eine minimale Breite anstatt in eine Zeilenänderung zu ändern. Es wird gehofft, dass die Faltung erfolgt und Bildlauffunktionen können gleichzeitig verwendet werden. Es ist zu hoffen, dass die baumförmige Tabelle TreeSelect ähnelt, wenn mehrere Auswahlmöglichkeiten getroffen werden.

Ich hoffe, dass die Tabellenkomponente der Tabellenkomponente von Element ähneln kann. Jede Spalte legt automatisch zuerst eine Breite fest. Es wird empfohlen, das Tabellenkopfzeichen ohne Umbruch auf Mindestbreite zu ändern. Es besteht die Hoffnung, dass die Faltfunktion und die Bildlauffunktion gleichzeitig verwendet werden können. Kann TreeSelect ähnlich sein

z5829984520 am 11. Sept. 2019

👍3

Gibt es eine Chance, dass Sie mit v4 oder vielleicht v5 etwas gegen die Anpassung unternehmen? MaterialUI ist viel einfacher anzupassen, was es immer wieder zu einer Wahl für das Projekt macht, an dem ich arbeite, auch wenn ich AntD wirklich gerne verwenden würde, da es viel vollständiger ist usw.
Bitte, bitte lassen Sie weniger fallen, um etwas Besseres für die Anpassung zu erhalten.

murbanowicz am 18. Sept. 2019

👍5 👎1

Nachdem eine Agentur unsere Antd-Web-App getestet hatte, stellten sie schwerwiegende Zugänglichkeitsfehler fest und wir erhielten die schlechteste Note. Bei der Untersuchung der Hauptgründe läuft es auf die folgenden RC-Komponenten hinaus:

rc-select (wir mussten durch Downshift ersetzen und oben Antd-Stile anwenden)
rc-tabs (siehe # 18798)
und vielleicht andere, die wir bisher nicht verwenden

Wie groß ist die Governance, die Antd gegenüber RC-Komponenten hat, und könnte das Team dies rechtzeitig für die Version 4.0 beheben? Die Barrierefreiheit wird immer relativ benachteiligt sein, aber in Wahrheit wird es immer schwieriger, sie zu ignorieren, da Unternehmen gesetzlich verpflichtet sind, den Mitarbeitern / Kunden barrierefreie Apps zur Verfügung zu stellen.

Sie können mich auf einige umfangreiche Tests mit Screenreadern und das Benchmarking mit Best Practices zählen.

filipjnc am 19. Sept. 2019

👍1

MaterialUI ist viel einfacher anzupassen

@ Murbanowicz könnten Sie

abenhamdine am 19. Sept. 2019

@abenhamdine Kein Problem!
In MUI gibt es ein ThemeProvider das Sie Ihre App einwickeln und das gesamte Thema nur anhand des JS-Objekts konfigurieren, das in TypeScript eingegeben wurde, damit es so schön ist, damit zu arbeiten.

In AntD müssen Sie zum Anpassen mit LESS oder SASS (mit einigen Plugins) herumspielen, damit Sie andere Deps usw. verwalten müssen. Sie müssen die Komponentenquelle durchsuchen, um eine Variable zu finden, die Sie für eine bestimmte Komponente usw. ändern möchten.
Es gibt auch keine gute Möglichkeit, das Thema in der Laufzeit zu ändern, was mit MUI so einfach ist, indem Sie einfach das JS-Objekt wechseln, das einfach vom Server usw. bezogen werden kann.

Wenn Sie nach einer Anpassung von AntD und MUI suchen, finden Sie einfache Beispiele für MUI, da es nichts zu besprechen gibt, da es einfach ist. Wenn Sie jedoch nach AntD-Cusotmization googeln, finden Sie viele hackige Lösungen usw.

Ich liebe AntD für Komplettierungen und so viele großartige Komponenten, aber die Anpassung ist wirklich schlecht und sollte aufgrund meiner Erfahrung und der Gespräche mit anderen Entwicklern einer der wichtigsten Punkte auf der Roadmap sein

murbanowicz am 19. Sept. 2019

👍6

@abenhamdine Kein Problem!
In MUI gibt es ein ThemeProvider das Sie Ihre App einwickeln und das gesamte Thema nur anhand des JS-Objekts konfigurieren, das in TypeScript eingegeben wurde, damit es so schön ist, damit zu arbeiten.
In AntD müssen Sie zum Anpassen mit LESS oder SASS (mit einigen Plugins) herumspielen, damit Sie andere Deps usw. verwalten müssen. Sie müssen die Komponentenquelle durchsuchen, um eine Variable zu finden, die Sie für eine bestimmte Komponente usw. ändern möchten.
Es gibt auch keine gute Möglichkeit, das Thema in der Laufzeit zu ändern, was mit MUI so einfach ist, indem Sie einfach das JS-Objekt wechseln, das einfach vom Server usw. bezogen werden kann.
Wenn Sie nach einer Anpassung von AntD und MUI suchen, finden Sie einfache Beispiele für MUI, da es nichts zu besprechen gibt, da es einfach ist. Wenn Sie jedoch nach AntD-Cusotmization googeln, finden Sie viele hackige Lösungen usw.
Ich liebe AntD für Komplettierungen und so viele großartige Komponenten, aber die Anpassung ist wirklich schlecht und sollte aufgrund meiner Erfahrung und der Gespräche mit anderen Entwicklern einer der wichtigsten Punkte auf der Roadmap sein

klare und präzise Erklärung, danke!

abenhamdine am 19. Sept. 2019

👍3

@abenhamdine Kein Problem!
In MUI gibt es ein ThemeProvider das Sie Ihre App einwickeln und das gesamte Thema nur anhand des JS-Objekts konfigurieren, das in TypeScript eingegeben wurde, damit es so schön ist, damit zu arbeiten.
In AntD müssen Sie zum Anpassen mit LESS oder SASS (mit einigen Plugins) herumspielen, damit Sie andere Deps usw. verwalten müssen. Sie müssen die Komponentenquelle durchsuchen, um eine Variable zu finden, die Sie für eine bestimmte Komponente usw. ändern möchten.
Es gibt auch keine gute Möglichkeit, das Thema in der Laufzeit zu ändern, was mit MUI so einfach ist, indem Sie einfach das JS-Objekt wechseln, das einfach vom Server usw. bezogen werden kann.
Wenn Sie nach einer Anpassung von AntD und MUI suchen, finden Sie einfache Beispiele für MUI, da es nichts zu besprechen gibt, da es einfach ist. Wenn Sie jedoch nach AntD-Cusotmization googeln, finden Sie viele hackige Lösungen usw.
Ich liebe AntD für Komplettierungen und so viele großartige Komponenten, aber die Anpassung ist wirklich schlecht und sollte aufgrund meiner Erfahrung und der Gespräche mit anderen Entwicklern einer der wichtigsten Punkte auf der Roadmap sein

Ich stimme @murbanowicz zu, dass die Anpassung mit Antd etwas chaotisch werden kann (globaler Stilleck, hackige Art der Verwendung von Sass, Prioritätskonflikte zwischen Stilüberschreibungen, ziemlich viele externe Abhängigkeiten wie moment was zu einer riesigen Bundle-Größe führt ), aber nachdem ich MUI schon lange verwendet habe, finde ich Antd viel anpassbarer.

Ich bin nicht auf dem neuesten Stand der neuen Versionen von MUI, aber als ich das letzte Mal nachgesehen habe, gab es einen Teil der Komponenten, die Sie nicht anpassen konnten, da MUI styled-components , wenn die Entwickler nicht classNames hinzugefügt haben.
Theming ist cool für die direkte Nutzung einer Bibliothek, aber wenn Sie das Styling an Ihr Design-System anpassen möchten, ist es mit MUI sehr chaotisch, manchmal sogar unmöglich;)

Trotzdem benötigt antd tatsächlich einige Arbeit, um die Anpassungserfahrung zu vereinfachen;)

pybuche am 19. Sept. 2019

👍4

@filipjnc ,
rc-select veröffentlichte Alpha-Version, die die Zugänglichkeit verbessert. Sie können helfen, dies zu testen. Und v4 prepare branch hat es verwendet. Sie können die Vorschau oben sehen.
Für rc-tabs werde ich es auch verbessern, aber später, da es nicht die oberste Priorität hat.

zombieJ am 20. Sept. 2019

@zombieJ in Ordnung, ich werde mir rc-select alpha ansehen.

Auch wenn rc-tabs keine Priorität hat, können Sie sich bitte meine Pull-Anfrage ansehen, in der ich die kritischsten Punkte aus unseren Zugänglichkeitstestergebnissen behebe.

filipjnc am 20. Sept. 2019

Ich habe hier ein Problem. Nach der aktuellen Icon-Reform-Methode, wenn es antd Komponentenform und Icon gibt
Kann nur einer der Aliase angegeben werden, wenn das Formular gleichzeitig eingeführt wird

zkwolf am 25. Sept. 2019

👎1

@zkwolf Ja, wir https://github.com/ant-design/ant-design-icons/pull/118

cc @vagusX

afc163 am 25. Sept. 2019

👎1

Ich würde mir sehr wünschen, dass das Problem mit dem ständigen Rendern von

avalanche1 am 30. Sept. 2019

👍1

Bitte beachten Sie, dass unter https://next.ant.design Komponenten in der Seitenleiste der Komponenten nicht alphabetisch sortiert sind
Schermata 2019-09-30 alle 18 01 03

avalanche1 am 30. Sept. 2019

👍1

Wie Sie vielleicht wissen, ist Ant-Design in Bezug auf die Zugänglichkeit nicht wirklich gut. Dies ist für die Mehrheit der Menschen an der Oberfläche nicht allzu sichtbar, aber ein großes Problem, wenn Sie tiefer tauchen. Sehen Sie hier, wie schlecht Ant-Design abschneidet: https://darekkay.com/blog/accessible-ui-frameworks/

Die gute Nachricht ist, dass ich Ameisendesign sehr liebe und es für Unternehmensprojekte weiter verwenden möchte. Mein Ziel ist es, es an die Spitze der Liste zu bringen.

Ich habe eine Agentur eine meiner Unternehmensanwendungen für einen Kunden in Deutschland testen lassen (wo Barrierefreiheit in großen Unternehmen ein großes Thema ist). Die kritischsten Dinge waren:

Zugänglichkeit des Bildschirmlesegeräts für grundlegende, aber wichtige Komponenten wie Select, Autocomplete und Tabs
Farbkontraste an vielen Stellen
Tastaturnavigation an einigen Stellen

Ich habe zuerst rc-tabs , um alle Probleme mit der Barrierefreiheit zu beheben. Es sollte bald veröffentlicht werden (https://github.com/react-component/tabs/pull/218). Aber was mich am meisten beunruhigt, ist rc-select , insbesondere der Combobox-Teil (Autocomplete). Comboboxen sind einer der schwierigsten Aspekte der Zugänglichkeit von Bildschirmleseprogrammen, und es ist leicht, Fehler zu machen. Um alle Probleme zu beheben, sind nicht nur einige Änderungen an den Arieneigenschaften erforderlich, sondern auch eine umfassende Überarbeitung.

Um das Problem in meiner Anwendung vor der Inbetriebnahme schnell zu beheben, habe ich Select und AutoComplete ( rc-select ) von ant-design durch meine eigenen Komponenten ersetzt, die auf https://github.com/downshift-js/downshift basieren

Die provokative Frage lautet also: Würden Sie in Betracht ziehen, nicht die Doppelarbeit zu machen und rc-select zugunsten der populäreren und vollständigeren downshift Bibliothek zu verwerfen? Sie könnten Zeit im Team sparen und sich darauf konzentrieren, die anderen Kernkomponenten zu perfektionieren, die auf dem Open-Source-Markt keine guten Alternativen bieten.

filipjnc am 4. Okt. 2019

👍13 ❤2 🎉1

Diese Idee sieht für mich fantastisch aus @filipjnc . Beim Herunterschalten ist es 1/4 der Größe von rc-select. Ich hoffe, das Antd-Team kann das schaffen.

ArthurBrito am 4. Okt. 2019

👍3

Ich würde gerne mehr Farbverbesserungen in der Version 4.0 sehen. In den Dokumenten wird insbesondere eine „Datenvisualisierungs-Farbpalette (in Kürze verfügbar)“ erwähnt, die in Dashboards und anderen datenintensiven Anwendungen sehr hilfreich wäre. Warme und kühle Grautöne würden auch dazu beitragen, zusammenhängendere Farbpaletten zu erstellen. Außerdem ist dies eine gute Gelegenheit, den Farbkontrast für die Barrierefreiheit festzulegen (wie von @filipjnc erwähnt). Mach weiter so 👍

jlarmstrongiv am 4. Okt. 2019

Wie Sie vielleicht wissen, ist Ant-Design in Bezug auf die Zugänglichkeit nicht wirklich gut. Dies ist für die Mehrheit der Menschen an der Oberfläche nicht allzu sichtbar, aber ein großes Problem, wenn Sie tiefer tauchen. Sehen Sie hier, wie schlecht Ant-Design abschneidet: https://darekkay.com/blog/accessible-ui-frameworks/
Die gute Nachricht ist, dass ich Ameisendesign sehr liebe und es für Unternehmensprojekte weiter verwenden möchte. Mein Ziel ist es, es an die Spitze der Liste zu bringen.
Ich habe eine Agentur eine meiner Unternehmensanwendungen für einen Kunden in Deutschland testen lassen (wo Barrierefreiheit in großen Unternehmen ein großes Thema ist). Die kritischsten Dinge waren:
1. Screen reader accessibility for basic but crucial components like Select, Autocomplete and Tabs

2. Color contrasts in many places

3. Keyboard navigation in some places
Ich habe zuerst rc-tabs als schnellen Gewinn ausgewählt, um alle Probleme mit der Barrierefreiheit zu beheben - es sollte bald herauskommen ( Reaktionskomponente / Tabs # 218 ). Aber was mich am meisten beunruhigt, ist rc-select , insbesondere der Combobox-Teil (Autocomplete). Comboboxen sind einer der schwierigsten Aspekte der Zugänglichkeit von Bildschirmleseprogrammen, und es ist leicht, Fehler zu machen. Um alle Probleme zu beheben, sind nicht nur einige Änderungen an den Arieneigenschaften erforderlich, sondern auch eine umfassende Überarbeitung.
Um das Problem in meiner Anwendung vor der Inbetriebnahme schnell zu beheben, habe ich Select und AutoComplete ( rc-select ) von ant-design durch meine eigenen Komponenten ersetzt, die auf https://github.com/downshift-js/downshift basieren
Die provokative Frage lautet also: Würden Sie in Betracht ziehen, nicht die Doppelarbeit zu machen und rc-select zugunsten der populäreren und vollständigeren downshift Bibliothek zu verwerfen? Sie könnten Zeit im Team sparen und sich darauf konzentrieren, die anderen Kernkomponenten zu perfektionieren, die auf dem Open-Source-Markt keine guten Alternativen bieten.

Ich würde mich nicht so für das Herunterschalten begeistern, siehe https://github.com/downshift-js/downshift/issues/730
Die Barrierefreiheit ist für einige Benutzer wichtig, aber die Leistung ist für noch mehr Benutzer wichtig.

abenhamdine am 5. Okt. 2019

👀1

Die Tabelle befindet sich in der Warteschlange. Derzeit arbeite ich an der virtuellen Liste.

Hallo, @zombieJ
Gibt es Fortschritte in der Zusammenfassungsfußzeile?

alexchen1875 am 8. Okt. 2019

@ alexchen1875 ,
In Erwartung einer neuen Aktualisierung des Lebenszykluscodes. Tabelle ist die nächste nach getan :)

zombieJ am 8. Okt. 2019

👍2 ❤1

4.0 Können einige Requisitenparameter in Kamelkoffer geändert werden? Zum Beispiel wird Input.TextArea in autosize in autoSize geändert?
Die Requisiten nativer HTML-Tags in React sind alle Kamel-Groß- und Kleinschreibung, wie z. B. <input autoComplete /> . Diese autosize immer nicht übereinstimmend aus. . .

jinliming2 am 9. Okt. 2019

👍7 👎1

Es kann in 3.x geändert werden, kompatibel mit der ursprünglichen Verwendung und diese verwerfen. @ jinliming2 Interessieren Sie sich für eine PR?

afc163 am 10. Okt. 2019

👎1

4.0 Warum sollten Sie die props.children von Tree als veraltete API markieren und stattdessen die reine Datenmethode von treeData empfehlen? Ich bin der Meinung, dass props.children sehr nützlich und sehr spielbar ist
ComponentWillReceiveProps wurde in der letzten API von react als veraltet markiert. Derzeit wird festgestellt, dass die Tabellenkomponente und die Animate-Komponente während des Versuchs noch vorhanden sind.

itlangzi am 14. Okt. 2019

👎1

+1 für Barrierefreiheit. Bitte!

timkindberg am 18. Okt. 2019

In Bezug auf die Größe des Löschsymbols scheint das Symbol anderer Komponenten 12 Pixel und der Datumsauswahl 14 Pixel groß zu sein. Wird der Unterschied zwischen der Größe anderer Komponenten und dem Suffixsymbol berücksichtigt, oder liegt es daran, dass der Datumsauswahl der Symbolschalter ist und 14 Pixel beträgt?Haben Sie Pläne, die Größe zu vereinheitlichen?

zkwolf am 19. Okt. 2019

👎1

@zombieJ plant, eine mehrspaltige Sortierfunktion für Tabellen hinzuzufügen

Nokecy am 23. Okt. 2019

👎1

Bitte schreiben Sie auf Englisch

akaguny am 23. Okt. 2019

👍15 ❤5 👀3 😄2 😕1 👎1

Wird das Problem einer zu großen Momentgröße behoben?

swaitw am 24. Okt. 2019

👎1

Wird das Problem einer zu großen Momentgröße behoben?

Versuchen Sie zuerst, dayjs zu verwenden

fatelei am 24. Okt. 2019

👍6 👎1

Kann es auf Englisch sein? In Anbetracht der Gefühle von Ausländern google ich immer google translate. Es ist nicht wichtig, dass die Grammatik nicht Standard ist, die Wörter können von ihnen verstanden werden

wanliyunyan am 24. Okt. 2019

👎3

@ afc163
Haben Sie gedacht, dass Ausländer diesem Repo folgen? Leider ist Google Translate kein gutes Tool, um zu verstehen, was Sie sagen. Mir ist klar, dass die meisten Entwickler und Benutzer von Ant-Design Chinesen sind, aber betrachten Sie auch Nicht-Chinesen?
Deshalb fordere ich Sie dringend auf, die internationale Sprache zu verwenden, um uns alle zu respektieren.

lvlohammadi am 24. Okt. 2019

👍19 ❤7 👎6

Hallo,
Ich wollte Ant Design 4.0 mit Create-React-App und Typescript ausprobieren.
Ich habe die Anweisungen unter https://next.ant.design/docs/react/introduce befolgt, kann aber keine funktionierende App erhalten.
Die folgenden grundlegenden Anweisungen ( import Button from 'antd/es/button'; ) für die Create-React-App verursachen Fehler:

Modul antd / es / button kann nicht gefunden werden

Nach dem Hinzufügen von React-App-Rewired, Customize-Cra, Babel-Plugin-Import und Ändern des Imports in import {Button} from 'antd' eine Fehlermeldung angezeigt:

Es konnte keine Deklarationsdatei für das Modul 'antd' gefunden werden.

Können Sie mir bitte einen Rat geben, wie Antd4 mit Crea-React-App und Typoskript funktioniert?

gynekolog am 24. Okt. 2019

@gynekolog ,
Bitte überprüfen Sie, ob node_modules korrekt installiert ist.

Siehe https://codesandbox.io/s/cool-paper-4y1u7

zombieJ am 24. Okt. 2019

@lvlohammadi Leider

yoyo837 am 25. Okt. 2019

❤12

@gynekolog ,
Bitte überprüfen Sie, ob node_modules korrekt installiert ist.
Siehe https://codesandbox.io/s/cool-paper-4y1u7

Du hast recht. ich renne

yarn add "https://github.com/ant-design/ant-design.git#4.0-prepare"

stattdessen

yarn add "[email protected]"

Schande...
Vielen Dank.

gynekolog am 25. Okt. 2019

dropdownMatchSelectWidth on Komponentenbruch in Alpha-Version auswählen, gültig in der vorherigen Version

GuichiZhao am 25. Okt. 2019

Wenn ich ein neues Projekt mit antd starten möchte, würden Sie Version 3 oder 4 Alpha wählen? Wie "produktionsbereit" ist die Version 4? Streben Sie immer noch eine Veröffentlichung im vierten Quartal an?

thj-dk am 1. Nov. 2019

👍1

Wenn ich ein neues Projekt mit antd starten möchte, würden Sie Version 3 oder 4 Alpha wählen? Wie "produktionsbereit" ist die Version 4? Streben Sie immer noch eine Veröffentlichung im vierten Quartal an?

Antd 4 ist noch nicht produktionsbereit. Sie sollten mit Antd 3 beginnen, der Übergang sollte einfach sein (insbesondere wenn Codemods wie erwartet bereitgestellt werden).

abenhamdine am 1. Nov. 2019

Ich hoffe, eine vollständige Trennung zwischen Logik und Anzeige zu sehen, das heißt, abgesehen von der Manipulation von Klassennamen macht js nichts anderes mit der Ansicht. Das visuelle Erscheinungsbild sollte alle von CSS (WENIGER) behandelt werden. Verwenden Sie anstelle von React Components möglicherweise auch Web Components, damit Nicht-React-Entwickler diese einfacher verwenden können.

yeegr am 4. Nov. 2019

👎2

Ich hoffe, eine vollständige Trennung zwischen Logik und Anzeige zu sehen, das heißt, abgesehen von der Manipulation von Klassennamen macht js nichts anderes mit der Ansicht. Das visuelle Erscheinungsbild sollte alle von CSS (WENIGER) behandelt werden. Verwenden Sie anstelle von React Components möglicherweise auch Web Components, damit Nicht-React-Entwickler diese einfacher verwenden können.

Ich denke, diese Idee, alles zu reinigen, ist sinnlos. Es ist besser, sich auf etwas Wichtigeres zu konzentrieren.

faradaytrs am 5. Nov. 2019

👍7

Gibt es Pläne für die Mehrfachauswahl in AutoComplete wie https://react-select.com?

nite am 5. Nov. 2019

👍3 👀1

Ich hoffe, eine vollständige Trennung zwischen Logik und Anzeige zu sehen, das heißt, abgesehen von der Manipulation von Klassennamen macht js nichts anderes mit der Ansicht. Das visuelle Erscheinungsbild sollte alle von CSS (WENIGER) behandelt werden. Verwenden Sie anstelle von React Components möglicherweise auch Web Components, damit Nicht-React-Entwickler diese einfacher verwenden können.
Ich denke, diese Idee, alles zu reinigen, ist sinnlos. Es ist besser, sich auf etwas Wichtigeres zu konzentrieren.

Ich glaube nicht, dass es dringlicher ist als die Trennung. In einem Team wird CSS im Allgemeinen von Designern verwaltet, während JS normalerweise von Programmierern ausgeführt wird. Wenn beide den Stil manipulieren, führt dies zu Chaos und unnötig verlorener Entwicklungszeit.

Nehmen wir zum Beispiel das Menü. Die Standardbreite und -höhe werden von JS festgelegt. Das Problem ist, dass das Menü entweder hervorsteht oder Lücken aufweist, wenn jemand die Breite oder Höhe des Outter-Wrappers ändern möchte. Dies würde erfordern, dass sowohl der Designer als auch der Codierer das Problem beheben, was Ausfallzeiten bedeutet.

Als Komponenten ist der Code nicht allzu komplex, die Trennung sollte nicht zu aufwändig sein, aber das Ergebnis würde den Benutzern und dem ant.design-Team selbst das Leben erheblich erleichtern.

yeegr am 7. Nov. 2019

Ein weiteres kleines Problem ist, dass Icon standardmäßig 16px und nicht 14px verwenden muss. Dies ist die globale Standardschriftgröße. Dies bedeutet, dass Icon Variablen wie @ default-icon-size, @ icon-size-lg usw. verwenden sollte, die vom Text getrennt sind. Dies ist nicht wirklich ein Fehler, sondern eine verlorene Funktion.

yeegr am 7. Nov. 2019

👀1 🚀1

@ afc163
Haben Sie gedacht, dass Ausländer diesem Repo folgen? Leider ist Google Translate kein gutes Tool, um zu verstehen, was Sie sagen. Mir ist klar, dass die meisten Entwickler und Benutzer von Ant-Design Chinesen sind, aber betrachten Sie auch Nicht-Chinesen?
Deshalb fordere ich Sie dringend auf, die internationale Sprache zu verwenden, um uns alle zu respektieren.

Die Menschen haben das Recht, ihre eigene Sprache zu verwenden, und sollten sich dabei wohl fühlen. So sehr ich die Bemühungen respektiere, durch die Bereitstellung von Übersetzungen das größtmögliche Publikum einzubeziehen, sollte niemandem ein Vortrag gehalten werden, nur um die Sprache zu verwenden, mit der er sich am wohlsten fühlt dass der Betreuer versteht zu kommunizieren. Die Idee, dass Hauptakteure dieses Projekts ihre Muttersprache nicht verwenden sollten, um zu kommunizieren, dass eine andere Sprache überlegen ist, ist mehr als absurd. Es ist in Ordnung, nach Übersetzungen zu fragen, aber mit Respekt. Antworten herabzustimmen, weil sie auf Chinesisch sind, ist sowohl kontraproduktiv als auch kindisch.

viztor am 9. Nov. 2019

👍21 👎1

Leute, hat And Design Version 4.0 JSS anstelle von _Less_ zum Generieren von CSS?

amerllica am 13. Nov. 2019

Leute, hat And Design Version 4.0 JSS anstelle von _Less_ zum Generieren von CSS?

AFAIK, nein. Sie können jedoch versuchen, zusätzlich zu weniger auch gestaltete Komponenten (zum Beispiel) zu verwenden.

abenhamdine am 13. Nov. 2019

👍2

Danke, lieber @ tomgao365 , ich erstelle das Problem, auf das Sie verwiesen haben. Ich möchte eine großartige PR für das vollständige Entfernen von Less erstellen und stattdessen

Außerdem habe ich eine kleine Frage, lieber @abenhamdine , was ist Ihre Idee, JSS anstelle von Less zu verwenden?

amerllica am 13. Nov. 2019

Außerdem habe ich eine kleine Frage, lieber @abenhamdine , was ist Ihre Idee, JSS anstelle von Less zu verwenden?

Hauptvorteile meiner Meinung nach:

dynamisches Styling (Schmerzen mit weniger)
Autocompletion (nicht sicher, hängt davon ab, welches Tool / welche JSS-Bibliothek Sie verwenden)
Vererbung von Stilen

einen Versuch wert.
Aber es ist keine Silberkugel.

abenhamdine am 13. Nov. 2019

Lieber @abenhamdine , ich hinterlasse ein Problem, das das Abzeichen Discussion . Es ist # 19181.

Und ich möchte mit der Implementierung von JSS beginnen und Less weglassen, aber eine neue Version kommt und ich befürchte, dass alle meine Bemühungen verschwendet werden.

amerllica am 16. Nov. 2019

Ich freue mich über eine Diskussion über das Ersetzen von moment.js durch eine Alternative wie Day.js oder das native Date Object hier https://github.com/ant-design/ant-design/issues/19738

xxyuk am 16. Nov. 2019

😄2

Wird es in Version 4 eine einfachere Möglichkeit geben, die Farbthemen mit der Create-React-App zu ändern?

flashtheman am 16. Nov. 2019

Ich stimme @flashtheman zu, dass es schön wäre, das Thema zu überschreiben, ohne mit weniger Variablen arbeiten zu müssen - also so etwas wie ThemeProvider aus Emotionen: https://emotion.sh/docs/theming

hsz am 16. Nov. 2019

👍2

In der jQuery-Ära sind Themeneinstellungen sehr beliebt und werden von Benutzern gerne verwendet.
Ich habe mehr als 2 Jahre auf eine einfache Möglichkeit gewartet, das Thema in der Produktionsumgebung zu ändern.

tomgao365 am 17. Nov. 2019

👍4 👎3

Wenn in der neuen Version der Symbolkomponente das Symbol dynamisch bestimmt wird, wie soll es in der neuen Version behandelt werden? Derzeit kann ich nur an die Verwendung von Zeichenfolgen "require + variable" denken. Es stellt sich heraus, dass nur das type-Attribut mit Variablen gefüllt werden muss. Gibt es eine andere Möglichkeit, damit umzugehen?
google translate: Wenn in der neuen Version der Symbolkomponente das Symbol dynamisch bestimmt wird, kann in der neuen Version vorerst nur an die Zeichenfolge require + variable gedacht werden, die das Original nur ausfüllen muss das Typattribut mit Variablen, welche anderen Verarbeitungsmethoden?

thding am 21. Nov. 2019

Wenn in der neuen Version der Symbolkomponente das Symbol dynamisch bestimmt wird, wie soll es in der neuen Version behandelt werden? Derzeit kann ich nur an die Verwendung von Zeichenfolgen "require + variable" denken. Es stellt sich heraus, dass nur das type-Attribut mit Variablen gefüllt werden muss. Gibt es eine andere Möglichkeit, damit umzugehen?
google translate: Wenn in der neuen Version der Symbolkomponente das Symbol dynamisch bestimmt wird, kann in der neuen Version vorerst nur an die Zeichenfolge require + variable gedacht werden, die das Original nur ausfüllen muss das Typattribut mit Variablen, welche anderen Verarbeitungsmethoden?

Versuchen Sie es mit https://github.com/smooth-code/loadable-components , die in der React-Dokumentation empfohlen werden

jinliming2 am 21. Nov. 2019

Wann wird die offizielle Version veröffentlicht?

guangming21 am 22. Nov. 2019

4.0 Unterstützt Table die Pivot-Funktion?

liuhaidi1209 am 28. Nov. 2019

@ afc163 - Scheint, als ob die Verschmutzung des globalen Stils das

meebix am 29. Nov. 2019

👍9

Gibt es Arbeiten zur Reduzierung der Komponentengröße?
Ausnahmsweise: Warum muss ich die gesamte Datei antd.css importieren, wenn ich ein einfaches Button möchte?

avalanche1 am 29. Nov. 2019

Gibt es Arbeiten zur Reduzierung der Komponentengröße?
Ausnahmsweise: Warum muss ich die gesamte Datei antd.css importieren, wenn ich ein einfaches Button möchte?

@ avalanche1 Siehe https://ant.design/docs/react/introduce#Usage

Verwenden Sie modularisierte Antd

jinliming2 am 30. Nov. 2019

Für mich reicht eine Upload-Komponente nicht aus, um die Unterstützung für das Rendern benutzerdefinierter Listen zu unterstützen.
Darüber hinaus beträgt der Upload-Fortschritt nur einen Prozentsatz, und es ist nicht bequem, ihn zu erweitern, um die Echtzeit-Geschwindigkeitsanzeige zu unterstützen.

codetalks-new am 3. Dez. 2019

@ banxi1988

https://github.com/ant-design/ant-design/blob/c824569ea0810e2cf11bc2953b333eb0e404fd1c/components/upload/interface.tsx#L47 -L52

Wenn Sie eine Geschwindigkeitsanzeige wünschen, hat onChange den Prozentsatz der hochgeladenen Datei zurückgegeben. Sie können die Upload-Geschwindigkeit berechnen.

muzea am 3. Dez. 2019

@ Z3SA https://caniuse.com/#search = CSS% 20Variables. Dies muss die gesamte IE-Unterstützung beenden. Die Beendigung der IE11-Unterstützung ist zu radikal, obwohl ich dies auch unterstütze.

Sie können dies immer noch mit Fallback-Unterstützung tun. Beispiel: color: var(--red, @red); Ein einfaches globales Suchen / Ersetzen für alle aktuellen Variablen würde dies lösen.

davidpanzarella am 5. Dez. 2019

Wird LESS zugunsten von SASS oder einer anderen besseren Styling-Lösung für v4 in Betracht gezogen oder nicht?

murbanowicz am 8. Dez. 2019

@murbanowicz , Hallo, danke für Ihren Kommentar. Ich hinterlasse ein Problem mit der Verwendung von JSS anstelle von Less Hier zeige ich meine Bereitschaft für diese Migration, aber niemand zeigt Aktionen.

amerllica am 8. Dez. 2019

Hallo @zombieJ , danke für deine großartige Arbeit an Ant Design? Gibt es Pläne, eine sofort einsatzbereite Möglichkeit zum Umschalten des dunklen Themas in der Anwendung bereitzustellen?

veeral-patel am 8. Dez. 2019

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.

shengliangli am 10. Dez. 2019

👎8

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.

@ Shengliangli glaubt, dass die Kopplung zu stark ist. . .

jinliming2 am 10. Dez. 2019

👎1

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.
@ Shengliangli glaubt, dass die Kopplung zu stark ist. . .

Ich denke, Form.Item ist eine "zusätzliche" Komponente, die von antd hinzugefügt wurde, um die Datenbindungsfunktion der Form-Komponente zu realisieren. Es gibt Gründe für diese Implementierung, aber schließlich wird eine zusätzliche Sache hinzugefügt. So wie jeder das Problem von zu viel modularem Code in Redux kritisiert, mögen Entwickler diese Art des Schreibens möglicherweise nicht. Wenn die von form.item implementierte Datenbindungsfunktion als die Merkmale von Eingabekomponenten wie Eingabe verstanden werden kann, um die Fähigkeit von Eingabekomponenten zu verbessern, fühlt sie sich natürlicher an?

Ich habe auch über das Problem der Kopplung nachgedacht. Die Wurzel des Problems könnte darin liegen, wie wir die Fähigkeiten und Verhaltensmerkmale von Eingabekomponenten definieren.

shengliangli am 11. Dez. 2019

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.
@ Shengliangli glaubt, dass die Kopplung zu stark ist. . .
Ich denke, Form.Item ist eine "zusätzliche" Komponente, die von antd hinzugefügt wurde, um die Datenbindungsfunktion der Form-Komponente zu realisieren. Es gibt Gründe für diese Implementierung, aber schließlich wird eine zusätzliche Sache hinzugefügt. So wie jeder das Problem von zu viel modularem Code in Redux kritisiert, mögen Entwickler diese Art des Schreibens möglicherweise nicht. Wenn die von form.item implementierte Datenbindungsfunktion als die Merkmale von Eingabekomponenten wie Eingabe verstanden werden kann, um die Fähigkeit von Eingabekomponenten zu verbessern, fühlt sie sich natürlicher an?
Ich habe auch über das Problem der Kopplung nachgedacht. Die Wurzel des Problems könnte darin liegen, wie wir die Fähigkeiten und Verhaltensmerkmale von Eingabekomponenten definieren.

Ich stimme dem nicht besonders zu. Ich denke, Form.Item ist hauptsächlich ein externes Paket einer Komponente, wie Attribute wie Beschriftung und Spalte, die wirklich nicht für die Inline-Integration in Komponenten geeignet sind.

dancerphil am 11. Dez. 2019

Hallo @zombieJ
Möchten Sie wissen, wann Version 4 veröffentlicht wird?
Ich freue mich darauf, wieder zu hören

madurak am 11. Dez. 2019

👀2

Wie trage ich auch zum Design bei?
Ich freue mich von jemandem zu hören

ekeminimarkk001 am 12. Dez. 2019

Die Beta.0-Version ist verfügbar. Bedeutet dies, dass Sie sie verwenden können?

fwh1990 am 12. Dez. 2019

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.

Zuallererst muss man wissen, dass es nichts damit zu tun hat, ob es eingebaut ist oder nicht. Die Verwendung von sogenannten eingebauten Komponenten kann als Unfall bezeichnet werden
getFieldDecorator ist die Brücke, die die Formularkomponente und die Eingabekomponente verbindet. Form.item wird an die beiden Attribute value und onChange , und die übergebene Komponente übergibt dann value und onChange Diese beiden Schnittstellenmethoden interagieren mit der Außenwelt. Mit anderen Worten, jede Komponente kann zu einem Parameter von getFieldDecorator werden, solange value und onChange implementiert sind.Dies ist die typische Idee von program to interface

PS: Ich habe den Quellcode nicht gelesen, alles oben Genannte ist meine Vermutung nach dem Lesen des Dokuments

GuichiZhao am 12. Dez. 2019

👍1

Der Grund, warum Form.Item mit dem zugrunde liegenden Component interagieren kann, hat nichts mit einem eingebauten Mechanismus zu tun, wie jemand erwartet. Es ist nur ein gängiger Trick in der Programmierwelt, der program to interface

Grundsätzlich stimmen die Form -Komponente und die zugrunde liegende Komponente über so etwas wie value und onChange überein. Sie dienen als Schnittstelle zwischen den beiden Welten, um zu kommunizieren. Es ist ein gutes Design zum Zwecke der Entkopplung

@dancerphil Vielleicht können Sie die Idee in der offiziellen Dokumentation genauer

GuichiZhao am 12. Dez. 2019

Hallo zusammen, v4 beta ist veröffentlicht. Die API ist jetzt stabil, was bedeutet, dass keine Änderungen an der API vorgenommen werden, es sei denn, es ist ein kritisches Problem aufgetreten. Während der Beta-Version helfen Designer bei der weiteren Anpassung des visuellen Designs der Benutzeroberfläche und wir konzentrieren uns auf die Fehlerbehebung. Sie können es gerne versuchen auf und helfen Sie uns für Feuerwanze oder Feedback.

Vielen Dank für alle, die am Codieren und Ausprobieren teilnehmen. Ihre Hilfe bedeutet viel :)

Hallo allerseits, die Beta-Version wurde veröffentlicht. Wenn die API keine größeren Designprobleme aufweist, werden keine weiteren Änderungen vorgenommen. In der Beta-Version helfen Designer bei der Anpassung des UI-Stils von Version 4, und wir konzentrieren uns auf Fehlerbehebungen. Willkommen, um uns bei der Suche nach Fehlern oder anderen Rückmeldungen zu helfen.

Vielen Dank für Ihre Teilnahme an der Entwicklungs- und Testarbeit. Ihre Hilfe ist sehr sinnvoll :)

ref: http://new-issue.ant.design/

zombieJ am 12. Dez. 2019

🎉9 ❤5 🚀3

Wie trage ich auch zum Design bei?
Ich freue mich von jemandem zu hören

@ ekeminimarkk001 finden Sie möglicherweise unter: https://ant.design/docs/react/contributing

jinliming2 am 12. Dez. 2019

@zombieJ Wurden alle in der Ausgabe aufgeführten Änderungen in der Beta-Version implementiert?

zachguo am 12. Dez. 2019

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.
Zuallererst muss man wissen, dass es nichts damit zu tun hat, ob es eingebaut ist oder nicht. Die Verwendung von sogenannten eingebauten Komponenten kann als Unfall bezeichnet werden
getFieldDecorator ist die Brücke, die die Formularkomponente und die Eingabekomponente verbindet. Form.item wird an die beiden Attribute value und onChange , und die übergebene Komponente übergibt dann value und onChange Diese beiden Schnittstellenmethoden interagieren mit der Außenwelt. Mit anderen Worten, jede Komponente kann zu einem Parameter von getFieldDecorator werden, solange value und onChange implementiert sind.Dies ist die typische Idee von program to interface
PS: Ich habe den Quellcode nicht gelesen, alles oben Genannte ist meine Vermutung nach dem Lesen des Dokuments

Nachdem ich Ihre Antworten gelesen habe, muss ich sagen, dass mein Vorschlag für die Formularkomponente von antd nicht zu ausgereift ist, aber andererseits denkt dieser Vorschlag vollständig über das Problem aus der Sicht eines normalen Benutzers nach. Wie kann es für eine Komponente mit einer so hohen Nutzungsintensität bequemer sein, zu entwickeln und zu verwenden, weniger Code zu schreiben und klarere und natürlichere Ausdrücke zu verwenden?

Aus Sicht des Benutzers ist antd bereits sehr gut. Die meisten Komponenten können verwendet werden, sobald sie verwendet werden. Vergessen Sie sie, wenn sie aufgebraucht sind, und verwenden Sie sie, wenn Sie sie das nächste Mal verwenden möchten. Der Grund, warum dieser Effekt erzielt werden kann, ist untrennbar mit dem guten API-Design und der Verpackung der Komponenten verbunden. Für einige Komponenten (z. B. from, table) gibt es jedoch noch Anwendungsszenarien, und es gibt Raum für bessere Verbesserungen.

Antd ist nur eine Werkzeugkomponente im Projekt. Es ist am besten, keinen eigenen Implementierungsmechanismus bereitzustellen oder den Implementierungsmechanismus in der externen API geschickt zu verbergen und zu assimilieren. Benutzer möchten diese Komponente nur verwenden, sie in der bequemsten und natürlichsten Form verwenden und kein Experte für eine Werkzeugkomponente sein.

Zurück zur Formularkomponente: Unter der aktuellen 3.x-API bin ich eher bereit, Ali-basiertes UFORM zu verwenden. Im Vergleich zu Antds Formular muss UFORM weniger Code schreiben und ist produktiver. Natürlich fühlt sich uform eher wie eine deklarative Schreibweise an, die sich stark von der Form von antd unterscheidet und möglicherweise nicht viel Wert als Referenz hat.

Als Antd-Party ist es ein bisschen peinlich, so viele Anforderungen zu stellen, aber aus Liebe hoffe ich, dass es besser ist, ich hoffe, das Projektteam versteht es und ich hoffe, die Entwicklung und Nutzung der Komponente unter der entsprechenden Version weiter zu optimieren .

shengliangli am 12. Dez. 2019

👍3 👎1

Sehr eigenartig. Ich habe Icon überhaupt nicht verwendet, aber ich habe alle Icons-SVG darin gepackt.

Versionsnummer: 4.0.0-beta.0. Babel-Plugin-Import und Tree-Shaking werden verwendet, sind aber nutzlos.

Xezzon am 14. Dez. 2019

👀2 👍1

Sehr eigenartig. Ich habe Icon überhaupt nicht verwendet, aber ich habe alle Icons-SVG darin gepackt.

Versionsnummer: 4.0.0-beta.0. Babel-Plugin-Import und Tree-Shaking werden verwendet, sind aber nutzlos.

Verwenden Sie diese Konfiguration

{
                    test: /\.js?$/,
                    include: [/node_modules[\\\\/]antd/],
                    use: [
                        {
                            loader: 'babel-loader',
                            options: {
                                plugins: [
                                    '@babel/plugin-syntax-dynamic-import',
                                    [
                                        'import',
                                        {
                                            libraryName: 'antd',
                                            style: true,
                                            libraryDirectory: 'es',
                                        },
                                        'ant',
                                    ],
                                    [
                                        'import',
                                        {
                                            libraryName: '@ant-design/icons',
                                            customName: name => {
    const formatName = name.split('-').reduce((acum, value) => acum + value[0].toUpperCase() + value.slice(1), '');

    return `@ant-design/icons/lib/icons/${formatName}`;
};
                                        },
                                        '@ant-design/icons',
                                    ],
                                ],
                            },
                        },
                    ],
                },

RavilM am 15. Dez. 2019

Sehr eigenartig. Ich habe Icon überhaupt nicht verwendet, aber ich habe alle Icons-SVG darin gepackt.

Versionsnummer: 4.0.0-beta.0. Babel-Plugin-Import und Tree-Shaking werden verwendet, sind aber nutzlos.

Verwenden Sie diese Konfiguration

{
                    test: /\.js?$/,
                    include: [/node_modules[\\\\/]antd/],
                    use: [
                        {
                            loader: 'babel-loader',
                            options: {
                                plugins: [
                                    '@babel/plugin-syntax-dynamic-import',
                                    [
                                        'import',
                                        {
                                            libraryName: 'antd',
                                            style: true,
                                            libraryDirectory: 'es',
                                        },
                                        'ant',
                                    ],
                                    [
                                        'import',
                                        {
                                            libraryName: '@ant-design/icons',
                                            customName: name => {
    const formatName = name.split('-').reduce((acum, value) => acum + value[0].toUpperCase() + value.slice(1), '');

    return `@ant-design/icons/lib/icons/${formatName}`;
};
                                        },
                                        '@ant-design/icons',
                                    ],
                                ],
                            },
                        },
                    ],
                },

Vielen Dank für Ihre Antwort, aber ich habe nicht gemäß Ihrer Konfiguration gearbeitet.

Xezzon am 16. Dez. 2019

Version: 4.0.0-beta.0
Problem: Wenn die sichtbare Modal-Komponente umgeschaltet wird, wird die Seite verschoben und die Adresse wiedergegeben:

https://next.ant.design/components/form-cn/#components -form-demo-form-in-modal
- https://next.ant.design/components/modal-cn/

xiaoxintang am 16. Dez. 2019

@xiaoxintang Es ist in der Hauptniederlassung behoben und wartet auf die Zusammenführung.

shaodahong am 16. Dez. 2019

@ afc163 Wie installiere ich antd4.0 beta

XianZhengquan am 18. Dez. 2019

👎2

https://next.ant.design/ legte auf

githubmann am 18. Dez. 2019

👀7

@ afc163 Wie installiere ich antd4.0 beta

npm install antd@next
ODER
yarn add antd@next

fwh1990 am 18. Dez. 2019

👍1

Es scheint, dass die Vorschau-Site kaputt ist. Ich erhalte nur den Fehler Seite nicht gefunden .

shaoran am 18. Dez. 2019

Ein Vorschlag zur Formularkomponente:
Ich freue mich sehr, dass in der neuen Version 4.0 die Formularkomponente für Entwickler freundlicher ist. Ich habe ein neues Beispiel gesehen, die Form.Item-Komponente unter der Form-Komponente muss getFieldDecorator nicht mehr verwenden. Dies ist eine sehr gute Verbesserung, aber ich habe einen radikaleren Vorschlag: Entfernen Sie die Form.Item-Komponente, optimieren Sie die Code-Schreiberfahrung weiter und aktualisieren Sie die Codierung. Die ursprünglichen Funktionen der Form.Item-Komponente werden direkt auf bestimmte Eingabekomponenten (wie Eingabe, DataPick usw.) übertragen.
Dies ist zu berücksichtigen, dass in den meisten Fällen in den entwickelten Formularen die integrierten Eingabekomponenten von antd verwendet werden, mit denen die Funktion der Form.Item-Komponente durch Verbesserung der Funktionen der Eingabekomponenten realisiert werden kann, und für einige spezielle Fälle (z. B. Benutzer) Definieren Sie Komponenten, bestimmte Eingabekomponenten möchten nicht an Form gebunden sein. Sie können spezielle Verpackungskomponenten für Anweisungen bereitstellen.
Die Forschung zu Antd ist nicht gründlich und schlägt nur Appellvorschläge aus der Sicht gewöhnlicher Benutzer vor. Wenn etwas nicht stimmt, wenden Sie sich bitte an Haihan.

Sie können dies versuchen: https://github.com/aweiu/ant-modifier

aweiu am 21. Dez. 2019

Gibt es Optimierungen für die globale Verschmutzung?

k644606347 am 26. Dez. 2019

Gibt es Optimierungen für die globale Verschmutzung?

Antd scheint Präfixe zu haben, es ist keine Verschmutzung.Ihr eigener Projekt-CSS-Code kann versuchen, CSS-Module zu verwenden, um das Problem der globalen Verschmutzung zu lösen

fwh1990 am 27. Dez. 2019

Gibt es Optimierungen für die globale Verschmutzung?
Antd scheint Präfixe zu haben, es ist keine Verschmutzung.Ihr eigener Projekt-CSS-Code kann versuchen, CSS-Module zu verwenden, um das Problem der globalen Verschmutzung zu lösen

Nun, ich kenne dieses Präfix. Ich meine die Verschmutzung des globalen CSS-Reset-Teils, das das Verschmutzungsproblem ist, das durch die Einführung von Antd- und CSS-Reset in Legacy-Projekten verursacht wird.

k644606347 am 28. Dez. 2019

Gibt es Optimierungen für die globale Verschmutzung?
Antd scheint Präfixe zu haben, es ist keine Verschmutzung.Ihr eigener Projekt-CSS-Code kann versuchen, CSS-Module zu verwenden, um das Problem der globalen Verschmutzung zu lösen

Weitere Informationen finden Sie in der Problemdiskussion auf dem offiziellen Website-Link: https://ant.design/docs/react/faq-cn#antd -% E8% A6% 86% E7% 9B% 96% E4% BA% 86% E6% 88 % 91% E7% 9A% 84% E5% 85% A8% E5% B1% 80% E6% A0% B7% E5% BC% 8F% EF% BC% 81

k644606347 am 28. Dez. 2019

Gibt es einen Plan zur Migration des Antd Pro 4.0-Layouts von Antd Pro 4.0?
Beim Migrieren des Projekts selbst bin ich auf den Fehler SiderMenu.js Icon.createFromIconfontCN im Pro-Layout gestoßen. Da die Abhängigkeit im Pro-Layout immer noch die Version 3 ist, weiß ich nicht, wie ich die Abhängigkeit ändern soll. Jemand, der es weiß, wird es mir beibringen

wushizhan am 4. Jan. 2020

Gibt es einen Plan zur Migration des Antd Pro 4.0-Layouts von Antd Pro 4.0?
Beim Migrieren des Projekts selbst bin ich auf den Fehler SiderMenu.js Icon.createFromIconfontCN im Pro-Layout gestoßen. Da die Abhängigkeit im Pro-Layout immer noch die Version 3 ist, weiß ich nicht, wie ich die Abhängigkeit ändern soll. Jemand, der es weiß, wird es mir beibringen

Da das Symbol in 4.0 getrennt wurde, muss der Import geändert werden. Sie können next.ant.design verwenden, um das aktuelle Symbol-API-Dokument anzuzeigen

zkwolf am 6. Jan. 2020

Vielen Dank für Ihren Beitrag zur v4-Version. Schließen seit Veröffentlichung der Version 4.0.0-rc.0 : Ref. # 20661

zombieJ am 9. Jan. 2020

👍2

Ist StrictMode ein Ziel? Legacy-Kontext muss migriert werden https://github.com/ant-design/ant-design/issues/9870

ntucker am 10. Jan. 2020

👍2

https://github.com/ant-design/ant-motion/issues/272

prateekrastogi am 25. Jan. 2020

Können wir sowohl antd3 als auch antd4 im Repo behalten? Kann sich nicht überall ändern, da das Repo zu groß ist und fast die gesamte Codebasis neu geschrieben wird.
Wenn ja, können wir Antd3-CSS in globalem und Antd4-CSS nur für einige Ordner und deren untergeordnete Elemente beibehalten

Ekta398 am 11. Sept. 2020

War diese Seite hilfreich?

0 / 5 - 0 Bewertungen

Ant-design: 💥 Ant Design 4.0 ist in Bearbeitung!

Vorschau der Site

Rekapitulieren

🌓 Informationen zur Kompatibilität

Verwenden Sie die neueste React-API

Beenden Sie die IE9 / 10-Unterstützung

Anderes kompatibles Update

📦 Größe reduzieren

Symbolgröße optimieren

Entfernen Sie Draft.js

🧭 Leistungsoptimierung

Virtuelles Scrollen

Refactor Animation

🧩 Komponentenoptimierung

Bilden

Tabelle

Neuer DatePicker

🚀 Aktualisieren Sie weiter

🧶 Verbesserung der Zugänglichkeit

🎯 Entwickler-API-Standard

💼 Reagieren Sie auf den strengen Modus

💡 Verbessern Sie die Entwicklererfahrung

🐱 Designressource

Meilensteine

Q2

Q3

Q4

Willkommen an Bord

Einführung

🌓 Kompatibilitätsanpassung

Verwenden Sie die neueste Version der React API

Beenden Sie die IE9 / 10-Unterstützung

Andere Kompatibilitätsanpassungen

📦 Lautstärke reduzieren

Symbolgröße optimieren

Entfernen Sie Draft.js

🧭 Leistungsoptimierung

Virtuelle Schriftrolle

Animationsverbesserungen

🧩 Über Komponenten

Formularkomponente

Tabellenkomponente

DatePicker erneuert

🚀 Kontinuierliche Aktualisierung

🧶 Verbessern Sie die Barrierefreiheit

🎯 Entwickler-API-Spezifikation

💼 Reagieren Sie auf den strengen Modus

💡 Verbessern Sie die Entwicklererfahrung

🐱 Asset Management verwalten

Zeitplan

Q2

Q3

Q4

Willkommen zur Teilnahme

Hilfreichster Kommentar

15311

Alle 182 Kommentare

15311

V4 Alpha vorbereiten

Hauptsächlich Ziel

Ziel fortsetzen

Über templateAreas

Über Abhängigkeit

Über Icon

关于templateAreas

关于 依赖

关于 图标

ungefähr templateAreas

15311

Jetzt ist die Zeit gekommen, moment.js loszuwerden!

:Hund:

https://github.com/ant-design/ant-motion/issues/272

Verwandte Themen

Über `templateAreas`

关于`templateAreas`

关于依赖

关于图标

ungefähr `templateAreas`