5.js 4.1 KB

12
  1. /*! NutUI v1.2.7 Tue Jun 05 2018 15:50:15 GMT+0800 (CST) */
  2. webpackJsonpnutui([5],{1048:function(t,e,i){(t.exports=i(2)()).push([t.i,".logo[data-v-740dd8ee]{margin:20px auto;height:120px;background:url("+i(1080)+") 50% no-repeat;background-size:contain}img[data-v-740dd8ee]{max-width:100%}@media (max-width:400px){.logo[data-v-740dd8ee]{height:100px}}",""])},1078:function(t,e,i){t.exports=i.p+"img/custom-build.png"},1080:function(t,e,i){t.exports=i.p+"img/nutui-logo3.png"},1148:function(t,e,i){t.exports={render:function(){var t=this,e=t.$createElement,v=t._self._c||e;return v("div",{staticClass:"wrapper"},[v("div",{staticClass:"logo"}),t._v(" "),v("h6",[t._v("NutUI是一套拥有电商基因的基于Vue2.0的轻量级移动端开源组件库,大部分组件来自「京东APP」、「京东ME」、「京东M站」中的实际项目。")]),t._v(" "),v("h5",[t._v("安装")]),t._v(" "),v("p",[t._v("1,推荐使用npm安装NutUI")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("npm install @nutui/nutui --save")])]),t._v(" "),v("p",[t._v("2,通常在webpack入口页面(app.js或main.js)引用完整组件库")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("import NutUI from '@nutui/nutui'")])]),t._v(" "),v("p",[t._v("3,初始化")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("NutUI.install(Vue)")])]),t._v(" "),v("p",[t._v("通过以上步骤即可完成整个NutUI组件库的安装。")]),t._v(" "),v("h5",[t._v("自定义构建(按需引用)")]),t._v(" "),v("p",[t._v("本组件库支持自定义构建(1.1.0版本以上),您可以根据需要只打包部分组件。")]),t._v(" "),v("p",[t._v("1,在项目目录下执行")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("npm install")])]),t._v(" "),v("p",[t._v("2,执行自定义构建命令")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("npm run custom")])]),t._v(" "),v("p",[t._v("3,在列表中,选择所有您需要打包的组件,然后按下回车键即开始构建")]),t._v(" "),v("img",{attrs:{src:i(1078),alt:""}}),t._v(" "),v("p",[t._v("4,片刻之后,自定义构建出的nutui.js文件会出现在dist目录下。在项目中引入和初始化的操作同上")]),t._v(" "),v("h5",[t._v("使用方法")]),t._v(" "),v("p",[t._v("使用方法大致分为两类。")]),t._v(" "),v("p",[t._v("1,扩展 HTML 元素,典型的Vue组件形式,使用方式类似原生HTML标签。如遮罩层(Mask)组件,直接使用标签即可。")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}],domProps:{textContent:t._s(t.demo1)}})]),t._v(" "),v("p",[t._v("2,挂在Vue.prototype上的实例方法,在需要的地方调用即可。如对话框(Dialog)组件。")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("this.$dialog(options);")])]),t._v(" "),v("p",[t._v("提示框(Toast)组件")]),t._v(" "),v("pre",[v("code",{directives:[{name:"highlight",rawName:"v-highlight"}]},[t._v("this.$toast(msg,during);")])]),t._v(" "),v("h5",[t._v("联系我们")]),t._v(" "),t._m(0),t._v(" "),v("h5",[t._v("使用项目")]),t._v(" "),v("p",[t._v("如果您在项目里使用了NutUI,欢迎告知。")])])},staticRenderFns:[function(){var t=this.$createElement,e=this._self._c||t;return e("p",[this._v("如果您在使用组件的过程中遇到了什么问题,或者有什么意见建议,都欢迎与我们联系:"),e("a",{attrs:{href:"mailto:nutui@jd.com"}},[this._v("nutui@jd.com")])])}]}},1242:function(t,e,i){var v=i(1048);"string"==typeof v&&(v=[[t.i,v,""]]),v.locals&&(t.exports=v.locals);i(3)("3a407e68",v,!0,{})},777:function(t,e,i){var v=i(1)(i(955),i(1148),function(t){i(1242)},"data-v-740dd8ee",null);t.exports=v.exports},955:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={data:function(){return{demo1:'<nut-mask \n:visible.sync="maskShow">\n</nut-mask>'}},components:{},methods:{}}}});