الصفحة الرئيسية>المتعلقة بالبرمجة>مكونات الطرف الثالث
تنزيل

VMC

مكونات الهاتف المحمول لـ [email protected]+.

إذا كنت بحاجة إلى استخدام VMC على vue1.x ، تحقق من فرع @1x.

عرض العروض التوضيحية

ميزة مقدمة

VMC هي مكتبة مكونة تم تطويرها لأطراف المحمول ، مناسبة لـ [email protected]+ .

  • مكونات العلامات مع تردد عالية الاستخدام وتسجيلها مباشرة على كائنات إنشاء VUE ؛
  • تعتمد جميع الأنماط على أقل وتسمح بالتهيئة السريعة لأنماط المكونات عن طريق الكتابة فوق متغيرات أقل ؛
  • في الوقت نفسه ، يمكنك أيضًا اختيار استخدام SASS ، ونحن نقدم أيضًا ورقة أنماط تعتمد على SCSS ؛
  • يمكن تعريف نمط كل مكون بشكل فردي من خلال السمات (اكتب إلى الأناقة بحيث يمكن كتابة النمط العالمي المحدد بأقل).

كيف تقتبس

وضع المنتجع الصحي القائم على حزمة الويب

التثبيت والمرجع 

$ npm install vmc --save

تسجيل المكونات العالمية

أضف ما يلي إلى ملف الإدخال: 

 import VMC from 'vmc/install' ;

Vue . use ( VMC ) ;

تقديم أنماط المكون

مع تراكب أقل متغيرًا ، يمكن تخصيص بعض الأنماط الأولية للمكونات ، لذلك يجب تقديم ملفات أقل يدويًا. 

 @import "vmc/src/styles/vmc.less" ;
@import "assets/less/vmc.custom.less" ;      // 自定义变量覆盖，参考styles/base/variable.less

أو استخدم تجاوز متغير SASS لتخصيص بعض الأنماط الأولية للمكونات ، وتحتاج أيضًا إلى تقديم ملفات SCSS يدويًا. 

 @import "assets/scss/vmc.custom.scss" ;      // 自定义变量覆盖，参考scss/base/variable.scss
@import "vmc/src/scss/vmc.scss" ;

المكونات المرجعية 

 import { Navbar } from 'vmc' ;

مرجع العلامة العادية

التثبيت والمرجع

قم بتنزيل ملفات vmc.css و vmc.js مباشرةً في dist Directory. 

 < link rel =" stylesheet " href =" vmc.css " >

< div id =" app " >
    < v-button type =" success " @click =" $Alert('Hello world!') " >按钮</ v-button >
</ div >

< script src =" vue.js " > </ script >
< script src =" vmc.js " > </ script >

< script >
    new Vue ( {
        el : '#app'
    } ) ;
</ script >

تسجيل المكونات العالمية

تقوم هذه الطريقة تلقائيًا بتسجيل المكونات العالمية وتسجيل جميع المكونات تلقائيًا دون عمليات إضافية.

قائمة المكونات

مكونات CSS

  • أيقونة icono (رمز)

  • حدود 1 بكسل (حدود 1 بكسل)

  • شعار (شارة)

  • محاذاة كلا الطرفين (تبرير)

  • إغفال النص (Nowrap)

  • النقطة الحمراء

مكونات JS

  • Actionsheet

  • صندوق تحذير (تنبيه)

  • صندوق العدوى (صندوق)

  • زر

  • بطاقة

  • عمود واحد (خلية)

  • مربع الاختيار

  • يتأكد

  • مربع الحوار

  • تحديث ترقيم الصفحات (القائمة القائمة)

  • شبكة

  • مربع الإدخال القسري (Minput)

  • مربع الإدخال المطالب (VINPUT)

  • محاذاة كلا الطرفين (تبرير)

  • إعلان المتداول (سرادق)

  • Navbar

  • المدخلات الرقمية (رقم)

  • تراكب

  • منقار

  • طبقة منبثقة (منبثقة)

  • المنبثقة المنبثقة

  • منتقي تاريخ المنبثقة

  • ProgressBar

  • مربع الإدخال المطالب (موجه)

  • مربع الراديو

  • تصنيف (راتر)

  • صف العنوان

  • صورة كاروسيل (شريط التمرير)

  • المؤشر الديناميكي (الدوار)

  • زر إرسال (إرسال)

  • شريط التنقل (Tabbar)

  • TabControl

  • Textarea

  • التبديل (تبادل)

  • موجه التحميل

  • موجه النجاح (النجاح)

  • موجه الخطأ (خطأ)

  • موجه المعلومات (معلومات)

  • موجه النص (نخب)

  • مكون تحميل (تحميل)

التنمية والتجميع

تطوير 

 $ npm run dev

بعد تنفيذ الأمر ، سيتم تشغيل الملفات في دليل examples تلقائيًا للتطوير والتصحيح.

يطلق 

 $ npm run release

بعد تنفيذ الأمر ، سيتم نشر vmc على dist Directory.

التجميع 

 $ npm run build

بعد تنفيذ الأمر ، سيتم تعبئة الملفات الموجودة في دليل examples تلقائيًا في دليل docs .

معاينة 

 $ npm run docs

بعد تنفيذ الأمر ، سيتم استخدام دليل docs كمورد خادم مستند ثابت ويمكن الوصول إليه مباشرة من المتصفح.

رخصة

معهد ماساتشوستس للتكنولوجيا

يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل