violet designダウンロード - violet designソースコードのダウンロード

violet design

サードパーティ製コンポーネント

v0.3.4: Merge pull request #185 from zhaoyuuu

ダウンロード

「React」フレームワークに基づくパーソナライズされたUIコンポーネントライブラリは、主にエンタープライズレベルのミドルエンドおよびバックエンドシステムで使用されています。

導入

設計仕様の要件を満たすために、当社のチームは、ReactベースのUIコンポーネントライブラリである「Violet Design」を開発しました。 Violet Designは、非常に美しく調整されている間、さまざまなビジネスニーズを満たす豊富なコンポーネントと機能を提供します。

特性

？直感的に設計されたインタラクティブな言語と視覚スタイル。
？箱から出して高品質のReactコンポーネント。
？§ TypeScriptで開発され、完全なタイプ定義ファイルを提供します。
friendフレンドリーAPI、スペースの無料で柔軟な使用。
？詳細で美しいUI。
？明確で明確なデモサイトと詳細なドキュメント。

互換性

角	Firefox	クロム	サファリ	オペラ
角	最後の2つのバージョン	最後の2つのバージョン	最後の2つのバージョン	最後の2つのバージョン

インストール

NPMを使用してインストールします

NPMを使用してインストールし、エコシステムとツールによってもたらされる利便性を享受してください。これは、開発環境で簡単にデバッグできる、または生態環境でパッケージ化および展開できることをお勧めします。

$ npm install violet-design

糸を使用してインストールします

$ yarn add violet-design

ブラウザの紹介

ブラウザ内のscriptとlinkタグを使用して、ファイルを直接インポートし、グローバル変動VioletDesignを使用します。

CSSの紹介：

 < link rel =" stylesheet " href =" https://unpkg.com/violet-design/dist/index.css " >

JSの紹介：

 < script src =" https://unpkg.com/violet-design/dist/index.umd.js " > </ script >

例

1.スタイルを紹介します

in index.tsx(.jsx) ：

 import 'violet-design/dist/index.css'

2。コンポーネントを使用します

 import React from 'react' ;
import { Button } from 'violet-design' ;

const App = ( ) => (
  < >
    < Button btnType = "primary" size = "lg" > PRESS ME </ Button >
  </ >
) ;

オンデマンドでロードします

violet-design 、デフォルトでESモジュールに基づいてツリーの揺れをサポートします。

タイプスクリプト

violet-design TypeScriptを使用して記述され、完全な定義ファイルを提供します。

コンポーネント

？汎用コンポーネント：ボタンボタン、アイコンアイコン
ナビゲーションコンポーネント：メニューナビゲーションメニュー
？データ入力コンポーネント：オートコンプリートオートコンプリート、カスケード選択、チェックボックスマルチチェックボックス、デートピッカーデートセレクター、範囲ピッカーデートレンジセレクター、フォーム、フォーム、入力入力ボックス、入力ナンバーデジタル入力ボックス、ラジオグループボタングループ、選択セレクター、スイッチスイッチ、アップロードアップロードアップロードアップロードアップロードアップロード
？データの表示コンポーネント：カレンダーカレンダー、タブページ
？フィードバックコンポーネント：Progress Progress Bar
？レイアウトコンポーネント：グリッド
？その他のコンポーネント：fixプシュピン、遷移