formily admin template

Formily-Administrator-Vorlage

Dies ist ein formaler Hintergrund im Bereich Admin-Management. Sie können zwischen Vue2/React und Element UI/Antd UI in Kombination mit Axios & Iconfont & Lint wählen, die zum Erstellen des Backends erforderlich sind.

Die Funktionsbeispiele stammen aus dem vue-element-admin-Projekt. Dieses Warehouse verwendet lediglich @formily-bezogene Bibliotheken, um einige der allgemeinen Funktionen zu ersetzen.

• Vue2 basiert auf [email protected]
• React basiert auf webpack@^4.41.5",

Verwandte Projekte

• Funktionsbeispiel Quelle vue-element-admin

Vue Build-Setup

 # 克隆项目
git clone https://github.com/wangwangtou/formily-admin-template.git

# 建议不要直接使用 cnpm 安装以来，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npmmirror.com

# 进入mock目录

cd formily-admin-template/mock

# 安装依赖
npm install

# 进入项目目录
cd formily-admin-template/vue2

# 安装依赖
npm install

# 启动服务
npm run dev

Browserzugriff http://localhost:9527

Build-Setup reagieren

 # 克隆项目
git clone https://github.com/wangwangtou/formily-admin-template.git

# 建议不要直接使用 cnpm 安装以来，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npmmirror.com

# 进入mock目录

cd formily-admin-template/mock

# 安装依赖
npm install

# 进入项目目录
cd formily-admin-template/react

# 安装依赖
npm install --force

# 启动服务
npm run start

Browserzugriff http://localhost:3000

formell gestaltbares Beispiel

Das React-Projekt enthält formell gestaltbare Beispiele. Sie können die Seite im Projekt ändern. Das geänderte Schema wird im Speicher gespeichert.

• ./react/designable Home-Verzeichnis
• ./react/designable/components Die Komponenteninformationen der für designable registrierten Projektkomponente
• ./react/designable/decorator fügt Decorator-Einstellungen zu designable hinzu. Sie können aus mehreren definierten Decorators wählen.
• SchemaEditorWidget-Konfiguration von ./react/designable/schemas-Komponenten und Decorator
• ./react/designable/setters Komponenten von SchemaEditorWidget
• ./react/designable/dn Komponentenliste und Klassifizierung für designbare Kontrollen
• ./react/designable/formily Eine Zusammenfassung der Formily-Komponenten, einschließlich Antd- und Projektkomponenten
• Rendering von ./react/designable/main designable

Verwendung im Vue

Der aktuelle Plan besteht darin, React zu verwenden, um den Designerteil fertigzustellen, und ihn dann über systemjs in Vue zu laden.

• Verwenden Sie React, um verschiedene Arten von Steuerelementen zu definieren, Steuerelementeigenschaften zuzuordnen und EditorSchema anzupassen. (Siehe Katalogbeschreibung oben)
• Exportieren Sie die Module, die Sie verwenden müssen, in ./react/editor.tsx
• Durch Ausführen von cd ./react && npm build:editor wird die systemjs-Moduldatei des Editors im Verzeichnis ./vue2/public generiert, das direkt als Vorlage für das Vue-Projekt verwendet werden kann. Die Vorlage enthält die systemjs-Importmap des Editors
• Designable über vue2/src/views/designable/index.vue laden

Lizenz

MIT-Lizenz.

Copyright (c) 2017-heute wangwangtou