/******/ (function(modules) { // webpackBootstrap /******/ function hotDisposeChunk(chunkId) { /******/ delete installedChunks[chunkId]; /******/ } /******/ var parentHotUpdateCallback = window["webpackHotUpdate"]; /******/ window["webpackHotUpdate"] = /******/ function webpackHotUpdateCallback(chunkId, moreModules) { // eslint-disable-line no-unused-vars /******/ hotAddUpdateChunk(chunkId, moreModules); /******/ if(parentHotUpdateCallback) parentHotUpdateCallback(chunkId, moreModules); /******/ } ; /******/ /******/ function hotDownloadUpdateChunk(chunkId) { // eslint-disable-line no-unused-vars /******/ var head = document.getElementsByTagName("head")[0]; /******/ var script = document.createElement("script"); /******/ script.type = "text/javascript"; /******/ script.charset = "utf-8"; /******/ script.src = __webpack_require__.p + "" + chunkId + "." + hotCurrentHash + ".hot-update.js"; /******/ ; /******/ head.appendChild(script); /******/ } /******/ /******/ function hotDownloadManifest(requestTimeout) { // eslint-disable-line no-unused-vars /******/ requestTimeout = requestTimeout || 10000; /******/ return new Promise(function(resolve, reject) { /******/ if(typeof XMLHttpRequest === "undefined") /******/ return reject(new Error("No browser support")); /******/ try { /******/ var request = new XMLHttpRequest(); /******/ var requestPath = __webpack_require__.p + "" + hotCurrentHash + ".hot-update.json"; /******/ request.open("GET", requestPath, true); /******/ request.timeout = requestTimeout; /******/ request.send(null); /******/ } catch(err) { /******/ return reject(err); /******/ } /******/ request.onreadystatechange = function() { /******/ if(request.readyState !== 4) return; /******/ if(request.status === 0) { /******/ // timeout /******/ reject(new Error("Manifest request to " + requestPath + " timed out.")); /******/ } else if(request.status === 404) { /******/ // no update available /******/ resolve(); /******/ } else if(request.status !== 200 && request.status !== 304) { /******/ // other failure /******/ reject(new Error("Manifest request to " + requestPath + " failed.")); /******/ } else { /******/ // success /******/ try { /******/ var update = JSON.parse(request.responseText); /******/ } catch(e) { /******/ reject(e); /******/ return; /******/ } /******/ resolve(update); /******/ } /******/ }; /******/ }); /******/ } /******/ /******/ /******/ /******/ var hotApplyOnUpdate = true; /******/ var hotCurrentHash = "e3a15a2e7084f9fd20c6"; // eslint-disable-line no-unused-vars /******/ var hotRequestTimeout = 10000; /******/ var hotCurrentModuleData = {}; /******/ var hotCurrentChildModule; // eslint-disable-line no-unused-vars /******/ var hotCurrentParents = []; // eslint-disable-line no-unused-vars /******/ var hotCurrentParentsTemp = []; // eslint-disable-line no-unused-vars /******/ /******/ function hotCreateRequire(moduleId) { // eslint-disable-line no-unused-vars /******/ var me = installedModules[moduleId]; /******/ if(!me) return __webpack_require__; /******/ var fn = function(request) { /******/ if(me.hot.active) { /******/ if(installedModules[request]) { /******/ if(installedModules[request].parents.indexOf(moduleId) < 0) /******/ installedModules[request].parents.push(moduleId); /******/ } else { /******/ hotCurrentParents = [moduleId]; /******/ hotCurrentChildModule = request; /******/ } /******/ if(me.children.indexOf(request) < 0) /******/ me.children.push(request); /******/ } else { /******/ console.warn("[HMR] unexpected require(" + request + ") from disposed module " + moduleId); /******/ hotCurrentParents = []; /******/ } /******/ return __webpack_require__(request); /******/ }; /******/ var ObjectFactory = function ObjectFactory(name) { /******/ return { /******/ configurable: true, /******/ enumerable: true, /******/ get: function() { /******/ return __webpack_require__[name]; /******/ }, /******/ set: function(value) { /******/ __webpack_require__[name] = value; /******/ } /******/ }; /******/ }; /******/ for(var name in __webpack_require__) { /******/ if(Object.prototype.hasOwnProperty.call(__webpack_require__, name) && name !== "e") { /******/ Object.defineProperty(fn, name, ObjectFactory(name)); /******/ } /******/ } /******/ fn.e = function(chunkId) { /******/ if(hotStatus === "ready") /******/ hotSetStatus("prepare"); /******/ hotChunksLoading++; /******/ return __webpack_require__.e(chunkId).then(finishChunkLoading, function(err) { /******/ finishChunkLoading(); /******/ throw err; /******/ }); /******/ /******/ function finishChunkLoading() { /******/ hotChunksLoading--; /******/ if(hotStatus === "prepare") { /******/ if(!hotWaitingFilesMap[chunkId]) { /******/ hotEnsureUpdateChunk(chunkId); /******/ } /******/ if(hotChunksLoading === 0 && hotWaitingFiles === 0) { /******/ hotUpdateDownloaded(); /******/ } /******/ } /******/ } /******/ }; /******/ return fn; /******/ } /******/ /******/ function hotCreateModule(moduleId) { // eslint-disable-line no-unused-vars /******/ var hot = { /******/ // private stuff /******/ _acceptedDependencies: {}, /******/ _declinedDependencies: {}, /******/ _selfAccepted: false, /******/ _selfDeclined: false, /******/ _disposeHandlers: [], /******/ _main: hotCurrentChildModule !== moduleId, /******/ /******/ // Module API /******/ active: true, /******/ accept: function(dep, callback) { /******/ if(typeof dep === "undefined") /******/ hot._selfAccepted = true; /******/ else if(typeof dep === "function") /******/ hot._selfAccepted = dep; /******/ else if(typeof dep === "object") /******/ for(var i = 0; i < dep.length; i++) /******/ hot._acceptedDependencies[dep[i]] = callback || function() {}; /******/ else /******/ hot._acceptedDependencies[dep] = callback || function() {}; /******/ }, /******/ decline: function(dep) { /******/ if(typeof dep === "undefined") /******/ hot._selfDeclined = true; /******/ else if(typeof dep === "object") /******/ for(var i = 0; i < dep.length; i++) /******/ hot._declinedDependencies[dep[i]] = true; /******/ else /******/ hot._declinedDependencies[dep] = true; /******/ }, /******/ dispose: function(callback) { /******/ hot._disposeHandlers.push(callback); /******/ }, /******/ addDisposeHandler: function(callback) { /******/ hot._disposeHandlers.push(callback); /******/ }, /******/ removeDisposeHandler: function(callback) { /******/ var idx = hot._disposeHandlers.indexOf(callback); /******/ if(idx >= 0) hot._disposeHandlers.splice(idx, 1); /******/ }, /******/ /******/ // Management API /******/ check: hotCheck, /******/ apply: hotApply, /******/ status: function(l) { /******/ if(!l) return hotStatus; /******/ hotStatusHandlers.push(l); /******/ }, /******/ addStatusHandler: function(l) { /******/ hotStatusHandlers.push(l); /******/ }, /******/ removeStatusHandler: function(l) { /******/ var idx = hotStatusHandlers.indexOf(l); /******/ if(idx >= 0) hotStatusHandlers.splice(idx, 1); /******/ }, /******/ /******/ //inherit from previous dispose call /******/ data: hotCurrentModuleData[moduleId] /******/ }; /******/ hotCurrentChildModule = undefined; /******/ return hot; /******/ } /******/ /******/ var hotStatusHandlers = []; /******/ var hotStatus = "idle"; /******/ /******/ function hotSetStatus(newStatus) { /******/ hotStatus = newStatus; /******/ for(var i = 0; i < hotStatusHandlers.length; i++) /******/ hotStatusHandlers[i].call(null, newStatus); /******/ } /******/ /******/ // while downloading /******/ var hotWaitingFiles = 0; /******/ var hotChunksLoading = 0; /******/ var hotWaitingFilesMap = {}; /******/ var hotRequestedFilesMap = {}; /******/ var hotAvailableFilesMap = {}; /******/ var hotDeferred; /******/ /******/ // The update info /******/ var hotUpdate, hotUpdateNewHash; /******/ /******/ function toModuleId(id) { /******/ var isNumber = (+id) + "" === id; /******/ return isNumber ? +id : id; /******/ } /******/ /******/ function hotCheck(apply) { /******/ if(hotStatus !== "idle") throw new Error("check() is only allowed in idle status"); /******/ hotApplyOnUpdate = apply; /******/ hotSetStatus("check"); /******/ return hotDownloadManifest(hotRequestTimeout).then(function(update) { /******/ if(!update) { /******/ hotSetStatus("idle"); /******/ return null; /******/ } /******/ hotRequestedFilesMap = {}; /******/ hotWaitingFilesMap = {}; /******/ hotAvailableFilesMap = update.c; /******/ hotUpdateNewHash = update.h; /******/ /******/ hotSetStatus("prepare"); /******/ var promise = new Promise(function(resolve, reject) { /******/ hotDeferred = { /******/ resolve: resolve, /******/ reject: reject /******/ }; /******/ }); /******/ hotUpdate = {}; /******/ var chunkId = 0; /******/ { // eslint-disable-line no-lone-blocks /******/ /*globals chunkId */ /******/ hotEnsureUpdateChunk(chunkId); /******/ } /******/ if(hotStatus === "prepare" && hotChunksLoading === 0 && hotWaitingFiles === 0) { /******/ hotUpdateDownloaded(); /******/ } /******/ return promise; /******/ }); /******/ } /******/ /******/ function hotAddUpdateChunk(chunkId, moreModules) { // eslint-disable-line no-unused-vars /******/ if(!hotAvailableFilesMap[chunkId] || !hotRequestedFilesMap[chunkId]) /******/ return; /******/ hotRequestedFilesMap[chunkId] = false; /******/ for(var moduleId in moreModules) { /******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) { /******/ hotUpdate[moduleId] = moreModules[moduleId]; /******/ } /******/ } /******/ if(--hotWaitingFiles === 0 && hotChunksLoading === 0) { /******/ hotUpdateDownloaded(); /******/ } /******/ } /******/ /******/ function hotEnsureUpdateChunk(chunkId) { /******/ if(!hotAvailableFilesMap[chunkId]) { /******/ hotWaitingFilesMap[chunkId] = true; /******/ } else { /******/ hotRequestedFilesMap[chunkId] = true; /******/ hotWaitingFiles++; /******/ hotDownloadUpdateChunk(chunkId); /******/ } /******/ } /******/ /******/ function hotUpdateDownloaded() { /******/ hotSetStatus("ready"); /******/ var deferred = hotDeferred; /******/ hotDeferred = null; /******/ if(!deferred) return; /******/ if(hotApplyOnUpdate) { /******/ // Wrap deferred object in Promise to mark it as a well-handled Promise to /******/ // avoid triggering uncaught exception warning in Chrome. /******/ // See https://bugs.chromium.org/p/chromium/issues/detail?id=465666 /******/ Promise.resolve().then(function() { /******/ return hotApply(hotApplyOnUpdate); /******/ }).then( /******/ function(result) { /******/ deferred.resolve(result); /******/ }, /******/ function(err) { /******/ deferred.reject(err); /******/ } /******/ ); /******/ } else { /******/ var outdatedModules = []; /******/ for(var id in hotUpdate) { /******/ if(Object.prototype.hasOwnProperty.call(hotUpdate, id)) { /******/ outdatedModules.push(toModuleId(id)); /******/ } /******/ } /******/ deferred.resolve(outdatedModules); /******/ } /******/ } /******/ /******/ function hotApply(options) { /******/ if(hotStatus !== "ready") throw new Error("apply() is only allowed in ready status"); /******/ options = options || {}; /******/ /******/ var cb; /******/ var i; /******/ var j; /******/ var module; /******/ var moduleId; /******/ /******/ function getAffectedStuff(updateModuleId) { /******/ var outdatedModules = [updateModuleId]; /******/ var outdatedDependencies = {}; /******/ /******/ var queue = outdatedModules.slice().map(function(id) { /******/ return { /******/ chain: [id], /******/ id: id /******/ }; /******/ }); /******/ while(queue.length > 0) { /******/ var queueItem = queue.pop(); /******/ var moduleId = queueItem.id; /******/ var chain = queueItem.chain; /******/ module = installedModules[moduleId]; /******/ if(!module || module.hot._selfAccepted) /******/ continue; /******/ if(module.hot._selfDeclined) { /******/ return { /******/ type: "self-declined", /******/ chain: chain, /******/ moduleId: moduleId /******/ }; /******/ } /******/ if(module.hot._main) { /******/ return { /******/ type: "unaccepted", /******/ chain: chain, /******/ moduleId: moduleId /******/ }; /******/ } /******/ for(var i = 0; i < module.parents.length; i++) { /******/ var parentId = module.parents[i]; /******/ var parent = installedModules[parentId]; /******/ if(!parent) continue; /******/ if(parent.hot._declinedDependencies[moduleId]) { /******/ return { /******/ type: "declined", /******/ chain: chain.concat([parentId]), /******/ moduleId: moduleId, /******/ parentId: parentId /******/ }; /******/ } /******/ if(outdatedModules.indexOf(parentId) >= 0) continue; /******/ if(parent.hot._acceptedDependencies[moduleId]) { /******/ if(!outdatedDependencies[parentId]) /******/ outdatedDependencies[parentId] = []; /******/ addAllToSet(outdatedDependencies[parentId], [moduleId]); /******/ continue; /******/ } /******/ delete outdatedDependencies[parentId]; /******/ outdatedModules.push(parentId); /******/ queue.push({ /******/ chain: chain.concat([parentId]), /******/ id: parentId /******/ }); /******/ } /******/ } /******/ /******/ return { /******/ type: "accepted", /******/ moduleId: updateModuleId, /******/ outdatedModules: outdatedModules, /******/ outdatedDependencies: outdatedDependencies /******/ }; /******/ } /******/ /******/ function addAllToSet(a, b) { /******/ for(var i = 0; i < b.length; i++) { /******/ var item = b[i]; /******/ if(a.indexOf(item) < 0) /******/ a.push(item); /******/ } /******/ } /******/ /******/ // at begin all updates modules are outdated /******/ // the "outdated" status can propagate to parents if they don't accept the children /******/ var outdatedDependencies = {}; /******/ var outdatedModules = []; /******/ var appliedUpdate = {}; /******/ /******/ var warnUnexpectedRequire = function warnUnexpectedRequire() { /******/ console.warn("[HMR] unexpected require(" + result.moduleId + ") to disposed module"); /******/ }; /******/ /******/ for(var id in hotUpdate) { /******/ if(Object.prototype.hasOwnProperty.call(hotUpdate, id)) { /******/ moduleId = toModuleId(id); /******/ var result; /******/ if(hotUpdate[id]) { /******/ result = getAffectedStuff(moduleId); /******/ } else { /******/ result = { /******/ type: "disposed", /******/ moduleId: id /******/ }; /******/ } /******/ var abortError = false; /******/ var doApply = false; /******/ var doDispose = false; /******/ var chainInfo = ""; /******/ if(result.chain) { /******/ chainInfo = "\nUpdate propagation: " + result.chain.join(" -> "); /******/ } /******/ switch(result.type) { /******/ case "self-declined": /******/ if(options.onDeclined) /******/ options.onDeclined(result); /******/ if(!options.ignoreDeclined) /******/ abortError = new Error("Aborted because of self decline: " + result.moduleId + chainInfo); /******/ break; /******/ case "declined": /******/ if(options.onDeclined) /******/ options.onDeclined(result); /******/ if(!options.ignoreDeclined) /******/ abortError = new Error("Aborted because of declined dependency: " + result.moduleId + " in " + result.parentId + chainInfo); /******/ break; /******/ case "unaccepted": /******/ if(options.onUnaccepted) /******/ options.onUnaccepted(result); /******/ if(!options.ignoreUnaccepted) /******/ abortError = new Error("Aborted because " + moduleId + " is not accepted" + chainInfo); /******/ break; /******/ case "accepted": /******/ if(options.onAccepted) /******/ options.onAccepted(result); /******/ doApply = true; /******/ break; /******/ case "disposed": /******/ if(options.onDisposed) /******/ options.onDisposed(result); /******/ doDispose = true; /******/ break; /******/ default: /******/ throw new Error("Unexception type " + result.type); /******/ } /******/ if(abortError) { /******/ hotSetStatus("abort"); /******/ return Promise.reject(abortError); /******/ } /******/ if(doApply) { /******/ appliedUpdate[moduleId] = hotUpdate[moduleId]; /******/ addAllToSet(outdatedModules, result.outdatedModules); /******/ for(moduleId in result.outdatedDependencies) { /******/ if(Object.prototype.hasOwnProperty.call(result.outdatedDependencies, moduleId)) { /******/ if(!outdatedDependencies[moduleId]) /******/ outdatedDependencies[moduleId] = []; /******/ addAllToSet(outdatedDependencies[moduleId], result.outdatedDependencies[moduleId]); /******/ } /******/ } /******/ } /******/ if(doDispose) { /******/ addAllToSet(outdatedModules, [result.moduleId]); /******/ appliedUpdate[moduleId] = warnUnexpectedRequire; /******/ } /******/ } /******/ } /******/ /******/ // Store self accepted outdated modules to require them later by the module system /******/ var outdatedSelfAcceptedModules = []; /******/ for(i = 0; i < outdatedModules.length; i++) { /******/ moduleId = outdatedModules[i]; /******/ if(installedModules[moduleId] && installedModules[moduleId].hot._selfAccepted) /******/ outdatedSelfAcceptedModules.push({ /******/ module: moduleId, /******/ errorHandler: installedModules[moduleId].hot._selfAccepted /******/ }); /******/ } /******/ /******/ // Now in "dispose" phase /******/ hotSetStatus("dispose"); /******/ Object.keys(hotAvailableFilesMap).forEach(function(chunkId) { /******/ if(hotAvailableFilesMap[chunkId] === false) { /******/ hotDisposeChunk(chunkId); /******/ } /******/ }); /******/ /******/ var idx; /******/ var queue = outdatedModules.slice(); /******/ while(queue.length > 0) { /******/ moduleId = queue.pop(); /******/ module = installedModules[moduleId]; /******/ if(!module) continue; /******/ /******/ var data = {}; /******/ /******/ // Call dispose handlers /******/ var disposeHandlers = module.hot._disposeHandlers; /******/ for(j = 0; j < disposeHandlers.length; j++) { /******/ cb = disposeHandlers[j]; /******/ cb(data); /******/ } /******/ hotCurrentModuleData[moduleId] = data; /******/ /******/ // disable module (this disables requires from this module) /******/ module.hot.active = false; /******/ /******/ // remove module from cache /******/ delete installedModules[moduleId]; /******/ /******/ // when disposing there is no need to call dispose handler /******/ delete outdatedDependencies[moduleId]; /******/ /******/ // remove "parents" references from all children /******/ for(j = 0; j < module.children.length; j++) { /******/ var child = installedModules[module.children[j]]; /******/ if(!child) continue; /******/ idx = child.parents.indexOf(moduleId); /******/ if(idx >= 0) { /******/ child.parents.splice(idx, 1); /******/ } /******/ } /******/ } /******/ /******/ // remove outdated dependency from module children /******/ var dependency; /******/ var moduleOutdatedDependencies; /******/ for(moduleId in outdatedDependencies) { /******/ if(Object.prototype.hasOwnProperty.call(outdatedDependencies, moduleId)) { /******/ module = installedModules[moduleId]; /******/ if(module) { /******/ moduleOutdatedDependencies = outdatedDependencies[moduleId]; /******/ for(j = 0; j < moduleOutdatedDependencies.length; j++) { /******/ dependency = moduleOutdatedDependencies[j]; /******/ idx = module.children.indexOf(dependency); /******/ if(idx >= 0) module.children.splice(idx, 1); /******/ } /******/ } /******/ } /******/ } /******/ /******/ // Not in "apply" phase /******/ hotSetStatus("apply"); /******/ /******/ hotCurrentHash = hotUpdateNewHash; /******/ /******/ // insert new code /******/ for(moduleId in appliedUpdate) { /******/ if(Object.prototype.hasOwnProperty.call(appliedUpdate, moduleId)) { /******/ modules[moduleId] = appliedUpdate[moduleId]; /******/ } /******/ } /******/ /******/ // call accept handlers /******/ var error = null; /******/ for(moduleId in outdatedDependencies) { /******/ if(Object.prototype.hasOwnProperty.call(outdatedDependencies, moduleId)) { /******/ module = installedModules[moduleId]; /******/ if(module) { /******/ moduleOutdatedDependencies = outdatedDependencies[moduleId]; /******/ var callbacks = []; /******/ for(i = 0; i < moduleOutdatedDependencies.length; i++) { /******/ dependency = moduleOutdatedDependencies[i]; /******/ cb = module.hot._acceptedDependencies[dependency]; /******/ if(cb) { /******/ if(callbacks.indexOf(cb) >= 0) continue; /******/ callbacks.push(cb); /******/ } /******/ } /******/ for(i = 0; i < callbacks.length; i++) { /******/ cb = callbacks[i]; /******/ try { /******/ cb(moduleOutdatedDependencies); /******/ } catch(err) { /******/ if(options.onErrored) { /******/ options.onErrored({ /******/ type: "accept-errored", /******/ moduleId: moduleId, /******/ dependencyId: moduleOutdatedDependencies[i], /******/ error: err /******/ }); /******/ } /******/ if(!options.ignoreErrored) { /******/ if(!error) /******/ error = err; /******/ } /******/ } /******/ } /******/ } /******/ } /******/ } /******/ /******/ // Load self accepted modules /******/ for(i = 0; i < outdatedSelfAcceptedModules.length; i++) { /******/ var item = outdatedSelfAcceptedModules[i]; /******/ moduleId = item.module; /******/ hotCurrentParents = [moduleId]; /******/ try { /******/ __webpack_require__(moduleId); /******/ } catch(err) { /******/ if(typeof item.errorHandler === "function") { /******/ try { /******/ item.errorHandler(err); /******/ } catch(err2) { /******/ if(options.onErrored) { /******/ options.onErrored({ /******/ type: "self-accept-error-handler-errored", /******/ moduleId: moduleId, /******/ error: err2, /******/ orginalError: err, // TODO remove in webpack 4 /******/ originalError: err /******/ }); /******/ } /******/ if(!options.ignoreErrored) { /******/ if(!error) /******/ error = err2; /******/ } /******/ if(!error) /******/ error = err; /******/ } /******/ } else { /******/ if(options.onErrored) { /******/ options.onErrored({ /******/ type: "self-accept-errored", /******/ moduleId: moduleId, /******/ error: err /******/ }); /******/ } /******/ if(!options.ignoreErrored) { /******/ if(!error) /******/ error = err; /******/ } /******/ } /******/ } /******/ } /******/ /******/ // handle errors in accept handlers and self accepted module load /******/ if(error) { /******/ hotSetStatus("fail"); /******/ return Promise.reject(error); /******/ } /******/ /******/ hotSetStatus("idle"); /******/ return new Promise(function(resolve) { /******/ resolve(outdatedModules); /******/ }); /******/ } /******/ /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {}, /******/ hot: hotCreateModule(moduleId), /******/ parents: (hotCurrentParentsTemp = hotCurrentParents, hotCurrentParents = [], hotCurrentParentsTemp), /******/ children: [] /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId)); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { /******/ configurable: false, /******/ enumerable: true, /******/ get: getter /******/ }); /******/ } /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = "https://b.yzcdn.cn/zanui/weapp"; /******/ /******/ // __webpack_hash__ /******/ __webpack_require__.h = function() { return hotCurrentHash; }; /******/ /******/ // Load entry module and return exports /******/ return hotCreateRequire("./src/main.js")(__webpack_require__.s = "./src/main.js"); /******/ }) /************************************************************************/ /******/ ({ /***/ "../../packages/actionsheet/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Actionsheet 行动按钮

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-actionsheet\": \"path/to/zanui-weapp/dist/actionsheet/index\"\n  }\n}\n
\n

使用指南

\n
<button bindtap=\"openActionSheet\">Open ActionSheet</button>\n<view class=\"actionsheet-container\">\n  <!-- 监听自定义事件 cancel 和 actionclick，绑定回调函数 -->\n  <zan-actionsheet\n    show=\"{{ show }}\"\n    actions=\"{{ actions }}\"\n    cancel-text=\"{{ cancelText }}\"\n    cancel-with-mask=\"{{ cancelWithMask }}\"\n    bind:cancel=\"closeActionSheet\"\n    bind:actionclick=\"handleActionClick\"\n  >\n  </zan-actionsheet>\n</view>\n
\n
// 在 Page 中混入 Actionsheet 里面声明的方法\nPage({\n  data: {\n    show: false,\n    cancelWithMask: true,\n    actions: [{\n      name: '选项1',\n      subname: '选项描述语1',\n      loading: false\n    }, {\n      name: '选项2',\n      subname: '选项描述语2',\n      loading: false\n    }, {\n      name: '去分享',\n      openType: 'share'\n    }],\n    cancelText: '关闭 Action'\n  },\n  openActionSheet() {\n    this.setData({\n      'show': true\n    });\n  },\n  closeActionSheet() {\n    this.setData({\n      'show': false\n    });\n  },\n  handleActionClick({ detail }) {\n    // 获取被点击的按钮 index\n    const { index } = detail;\n  }\n});\n
\n

Actionsheet 支持的具体参数如下（ 传入时使用分隔线写法 ）

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
show用来表示是否展示行动按钮Booleanfalse
actions指定弹层里的按钮Array[]
cancelText行动按钮底部取消按钮的文案，不传则不显示取消按钮String
cancelWithMask是否在点击背景时，关闭行动按钮Booleanfalse
mask-class用于控制蒙层样式的外部类String
container-class用于控制容器样式的外部类String
\n

actions 的具体数据结构

\n
// actions 为数组结构传入\n[{\n  // 按钮文案\n  name: '选项1',\n  // 按钮描述文案，不传就不显示\n  subname: '选项描述语1',\n  // 按钮是否显示为 loading\n  loading: false,\n  // 按钮的微信开放能力\n  // 具体支持可参考微信官方文档：https://mp.weixin.qq.com/debug/wxadoc/dev/component/button.html\n  openType: 'share'\n}]\n
\n

\n\n
\n ","label":"Actionsheet 行动按钮"} /***/ }), /***/ "../../packages/badge/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Badge 徽章

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-badge\": \"path/to/zanui-weapp/dist/badge/index\"\n  }\n}\n
\n

代码演示

\n

基础用法

\n
<view class=\"badge-container\">\n  <zan-badge>10</zan-badge>\n</view>\n
\n

自定义参数

\n
<view class=\"badge-container\">\n  <zan-badge\n    color=\"{{ color }}\"\n    background-color=\"{{ backgroundColor }}\"\n    font-size=\"{{ fontSize }}\"\n    box-shadow=\"{{ boxShadow }}\"\n  >10</zan-badge>\n</view>\n
\n
.badge-container {\n  width: 100px;\n  height: 100px;\n}\n
\n

API

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值
color字体颜色String#fff
background-color背景颜色String#f44
font-size字体大小Number10
box-shadow为了更好的控制宽度，使用了box-shadow来实现badge的边框，可以根据box-shadow的语法自行修改颜色和宽度String0 0 0 2px #fff
\n

\n\n
\n ","label":"Badge 徽章"} /***/ }), /***/ "../../packages/btn/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Button 按钮

\n

使用指南

\n

在 json 文件中配置button组件

\n
\"usingComponents\": {\n  \"zan-button\": \"/dist/btn/index\"\n}\n
\n

代码演示

\n

基础用法

\n
<zan-button>取消订单</zan-button>\n
\n

按钮类型

\n

按钮支持额外的三种类型 primary, danger, warn

\n
<zan-button type=\"primary\">确认付款</zan-button>\n<zan-button type=\"danger\">确认付款</zan-button>\n<zan-button type=\"warn\">确认付款</zan-button>\n
\n

按钮大小

\n

按钮支持额外三种大小 large, small, mini

\n
<zan-button size=\"large\">确认付款</zan-button>\n<zan-button size=\"small\">取消订单</zan-button>\n<zan-button size=\"mini\">确认付款</zan-button>\n
\n

其他

\n

按钮镂空状态

\n
<zan-button plain>确认付款</zan-button>\n
\n

按钮加载状态

\n
<zan-button loading>确认付款</zan-button>\n
\n

按钮禁用状态

\n
<zan-button disabled>确认付款</zan-button>\n
\n

配合 button-group 使用

\n

通过配合 zan-button-group 使用，可以让按钮之间自动有合适的间距出现，使用方式如下

\n

1.在 json 文件中配置 button-group 组件

\n
\"usingComponents\": {\n  \"zan-button\": \"/dist/btn/index\",\n  \"zan-button-group\": \"/dist/btn-group/index\"\n}\n
\n

2.在 wxml 中直接引入

\n
<zan-button-group>\n  <zan-button>确认付款</zan-button>\n  <zan-button>再考虑下</zan-button>\n</zan-button-group>\n
\n

\"\"

\n

属性

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称类型是否必须默认描述
typeString否空按钮类型，值有primary、warn、danger
sizeString否空按钮大小，值有large、small、mini
plainBoolean否false\b按钮是否镂空，默认为false
disabledBoolean否false按钮是否禁用，默认为false
loadingBoolean否false按钮加载状态，默认为false
openTypeString否-微信开放能力
appParameterString否-打开 APP 时，向 APP 传递的参数
hoverStartTimeNumber否20按住后多久出现点击态，单位毫秒
hoverStayTimeNumber否70手指松开后点击态保留时间，单位毫秒
langString否en指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文
sessionFromString否-会话来源
sendMessageTitleString否当前标题会话内消息卡片标题
sendMessagePathString否当前分享路径会话内消息卡片点击跳转小程序路径
sendMessageImgString否截图会话内消息卡片图片
showMessageCardString否false显示会话内消息卡片
\n

事件

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
事件名称说明回调参数
btnclick按钮在可用状态被点击时触发
disabledclick在传入的 disabled 为 true 时，点击按钮会触发此事件
getuserinfo用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同wx.getUserInfo
contact客服消息回调
getphonenumber获取用户手机号回调
error当使用开放能力时，发生错误的回调
\n

\n\n
\n ","label":"Button 按钮"} /***/ }), /***/ "../../packages/capsule/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Capsule 胶囊

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-capsule\": \"/packages/capsule/index\"\n  }\n}\n
\n

代码演示

\n

Panel 提供了一块白色的展示区域，使用方式如下

\n
<zan-capsule color=\"#38f\" leftText=\"1折扣\" rightText=\"限购一份\" />\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
typecapsule的主体颜色String''（有danger这个主题色）
color自定义capsule颜色String-
leftText左侧文案String-
rightText右侧文案String-
\n

\n\n
\n ","label":"Capsule 胶囊"} /***/ }), /***/ "../../packages/card/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Card 卡片

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-card\": \"path/to/zanui-weapp/dist/card/index\"\n  }\n}\n
\n

代码演示

\n

基础用法

\n

卡片可以用于左侧图片，右侧描述信息的展示。默认是商品相关内容的展示，需要展示其他内容可以使用自定义slot。

\n
<zan-card\n  card-class=\"test-card\"\n  thumb=\"https://img.yzcdn.cn/upload_files/2016/11/25/FpqPXlrMRjKwJs8VdTu3ZDJCj4j5.jpeg?imageView2/2/w/200/h/200/q/90/format/jpeg\"\n  price=\"999.99\"\n  title=\"红烧牛肉【虚拟商品】【有库存】【有sku】\"\n  num=\"2\"\n  desc=\"3000克 50%\"\n  status=\"已发货\"\n>\n</zan-card>\n
\n

使用slot

\n

zan-card 由 zan-card__thumb 和 zan-card__detail 组成。分别负责左侧图片展示和右侧内容区域展示。两部分内容可以使用slot进行替换。

\n
<zan-card\n  card-class=\"test-card\"\n  useDetailSlot=\"{{ true }}\"\n>\n  <!-- 右侧详情 -->\n  <view slot=\"detail-slot\" class=\"zan-card__detail\">\n    我是标题\n  </view>\n</zan-card>\n
\n

API

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值
card-class自定义最外层classString-
thumb左侧缩略图String-
price商品价格String-
title商品标题String-
desc商品描述String-
num商品数量Number-
status商品状态String-
useDetailSlot是否使用detail-slot（true时需要添加对应slot）Booleanfalse
\n

\n\n
\n ","label":"Card 卡片"} /***/ }), /***/ "../../packages/cell/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Cell 单元格

\n

使用指南

\n

单个 cell 使用示例

\n
  {\n    ...\n    \"usingComponents\": {\n      \"zan-cell\": \"../../dist/cell/index\",\n    }\n    ...\n  }\n
\n
  <zan-cell title=\"单行列表\" label=\"附加描述\" value=\"详细信息\"></zan-cell>\n
\n

cell 组使用示例

\n

多个 cell 组件必须作为 cell-group 组件的子组件，否则可能出现显示问题。

\n
  {\n    ...\n    \"usingComponents\": {\n      \"zan-cell\": \"../../dist/cell/index\",\n      \"zan-cell-group\": \"../../dist/cell-group/index\"\n    }\n    ...\n  }\n
\n
  <zan-cell-group>\n    <zan-cell title=\"只显示箭头\" is-link></zan-cell>\n    <zan-cell title=\"跳转到首页\" is-link url=\"/pages/dashboard/index\"></zan-cell>\n    <zan-cell title=\"单行列表\" label=\"附加描述\" value=\"详细信息\"></zan-cell>\n    <zan-cell title=\"表单\">\n      <input slot=\"footer\" type=\"digit\" placeholder=\"带小数点的数字键盘\"/>\n    </zan-cell>\n    <zan-cell title=\"开关\">\n      <switch slot=\"footer\" checked/>\n    </zan-cell>\n  </zan-cell-group>\n
\n

属性与事件

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称类型是否必须默认描述
titleString否无左侧标题
labelBoolean否false标题下方的描述信息
valueString否取消右侧内容
isLinkBoolean否false是否展示右侧箭头并开启尝试以 url 跳转
urlString否-当 isLink 设置为 true 时，点击 cell 会尝试跳转到该路径
linkTypeString否navigateTo链接跳转类型，可选值为 navigateTo，redirectTo，switchTab，reLaunch
onlyTapFooterBoolean否false只有点击 footer 区域才触发 tab 事件
bindtapEventHandle否无点击 cell 时触发，onlyTapFooter 为 true 时点击 footer 区域触发
\n

可用的 slot

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称是否必须默认描述
默认否无左侧除了 title，label 外的自定义 wxml 内容
icon否无标题前自定义的 icon，可使用 icon 自定义组件，具体使用参考 icon 组件
footer否无右侧自定义 wxml 内容，如果设置了 value 属性，则不生效
\n\n
\n ","label":"Cell 单元格"} /***/ }), /***/ "../../packages/datetime-picker/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

DatetimePicker 时间选择

\n

使用 picker 组件开发的时间日期组件，弥补小程序 picker 自身对于快速时间选择的不支持。

\n

示例代码

\n
{\n  \"usingComponents\": {\n    \"zan-date-picker\": \"../../dist/datetime-picker/index\"\n  }\n}\n
\n
<zan-date-picker\n  bindchange=\"change\"  \n  bindcancel=\"cancel\"\n  placeholder=\"请选择一个时间\"\n  placeholder-class=\"my-customer-class-name\"\n  format=\"你选择了YYYY年MM月DD日HH点mm分ss秒\"\n/>\n
\n

属性与事件

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称类型是否必须默认描述
dateString否当前时间初始化时间，传入的值会被 Date 构造函数转换为一个 Date 对象，不合法的值将抛出一个错误
placeholder-classString否无自定义类，可改变 placeholder 样式，其他类无效，picker-view 为 true 时不支持
placeholderString否请选择时间设置 picker 的 placeholder,picker-view 为 true 时不支持
not-useArray否无不需要显示的列 可选择years, months, days, hours, minutes, seconds中的多个
picker-viewBoolean否无如果为 true，相当于 picker-view 组件
formatString否YYYY-MM-DD HH:mm:ss设置选中的时间显示的格式，支持 YYYY，yyyy，YY，yy，MM，M，DD，dd，D，d，HH， hh，H，h，mm，m，ss，s
bindchangeString是无用户点击确认触发该事件，返回值为按“年，月，日，时，分，秒”顺序的数组，可以通过detail.value获取
bindcancelString否无用户点击取消触发该事件
\n

方法

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称参数描述
getFormatStr无返回 format 格式的字符串，在 picker-view 为 true 时比较实用
\n

增强优化

\n\n\n
\n ","label":"DatetimePicker 时间选择"} /***/ }), /***/ "../../packages/dialog/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Dialog 弹出框

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-dialog\": \"path/to/zanui-weapp/dist/dialog/index\"\n  }\n}\n
\n

在需要使用的页面里引入组件库模板和脚本

\n
<zan-dialog id=\"zan-dialog-test\"></zan-dialog>\n
\n
const Dialog = require('path/to/zanui-weapp/dist/dialog/dialog');\n\nPage({\n  // ...\n  // 可以在任意方法里直接调用，即可唤起\n  handleClick() {\n    Dialog({\n      title: '',\n      message: '',\n      selector: '#zan-dialog-test'\n    }).then((res) => {\n      console.log(res);\n    })\n  }\n});\n
\n

代码演示

\n

按钮展示方式

\n

按钮可以通过设置 buttonsShowVertical 来切换按钮纵向展示或者横向并排展示，方便各种场景下使用。

\n
Dialog({\n  message: '这是一个模态弹窗',\n  buttonsShowVertical: true,\n  showCancelButton: true\n});\n
\n

自定义展示按钮

\n

dialog 支持自定义展示按钮。设置 buttons 数组即可实现。自定义按钮的点击后，都会在 resolve 状态中监听到。

\n
Dialog({\n  message: '这是一个模态弹窗',\n  buttons: [{\n    // 按钮文案\n    text: '现金支付',\n    // 按钮文字颜色\n    color: 'red',\n    // 按钮类型，用于在 then 中接受点击事件时，判断是哪一个按钮被点击\n    type: 'cash'\n  }, {\n    text: '微信支付',\n    color: '#3CC51F',\n    type: 'wechat'\n  }, {\n    text: '取消',\n    type: 'cancel'\n  }]\n}).then(({ type }) => {\n  // type 可以用于判断具体是哪一个按钮被点击\n  console.log('=== dialog with custom buttons ===', `type: ${type}`);\n});\n
\n

具体参数

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
message弹窗内容String-必须
selector显示弹窗对应组件节点的选择器String-必须
title弹窗标题String-
buttonsShowVertical按钮是否纵向展示Booleanfalse
showConfirmButton是否展示确认按钮Booleantrue
confirmButtonText确认按钮文案String确定
confirmButtonColor确认按钮文字颜色String#3CC51F
showCancelButton是否展示取消按钮Booleanfalse
cancelButtonText取消按钮文案String取消
cancelButtonColor取消按钮文字颜色String#333
buttons自定义按钮列表，设置以后，以上关于 确认 和 取消 按钮的设置全部不生效。Array-
\n

buttons 数据格式

\n
[{\n  // 按钮文案\n  text: '现金支付',\n  // 按钮文字颜色\n  color: 'red',\n  // 按钮类型，用于在 then 中接受点击事件时，判断是哪一个按钮被点击\n  type: 'cash'\n}, {\n  // 按钮文案\n  text: '微信支付',\n  // 按钮文字颜色\n  color: '#3CC51F',\n  // 按钮类型，用于在 then 中接受点击事件时，判断是哪一个按钮被点击\n  type: 'wechat'\n}, {\n  // 按钮文案\n  text: '取消',\n  // 按钮类型，用于在 then 中接受点击事件时，判断是哪一个按钮被点击\n  type: 'cancel'\n}]\n
\n

\n\n
\n ","label":"Dialog 弹出框"} /***/ }), /***/ "../../packages/field/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Field 输入框

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-field\": \"path/to/zanui-weapp/dist/field/index\"\n  }\n}\n
\n

代码演示

\n

基础用法

\n

field 支持多种展示方式，在 data 中传入对应的设置即可。

\n
<zan-field\n  title=\"{{ field.title }}\"\n  placeholder=\"{{ field.placeholder }}\"\n  focus=\"{{ field.focus }}\"\n  value=\"{{ field.value }}\"\n  bind:change=\"handleFieldChange\"\n>\n</zan-field>\n
\n
Page({\n  data: {\n    field: {\n      focus: true,\n      title: '收货人',\n      placeholder: '名字',\n      value: 'test'\n    }\n  }\n});\n
\n

Field 列表

\n
<zan-cell-group>\n  <zan-field title=\"姓名\"></zan-field>\n  <zan-field title=\"邮件\"></zan-field>\n</zan-cell-group>\n
\n

监听事件

\n

field会触发一些事件，当你需要监听这些事件时，可以绑定对应的事件。

\n
<zan-field\n  title=\"{{ field.title }}\"\n  placeholder=\"{{ field.placeholder }}\"\n  focus=\"{{ field.focus }}\"\n  value=\"{{ field.value }}\"\n  bind:change=\"handleFieldChange\"\n  bind:focus=\"handleFieldFocus\"\n  bind:blur=\"handleFieldBlur\"\n>\n</zan-field>\n
\n
Page(extend({}, {\n  data: {\n    field: {\n      focus: true,\n      title: '收货人',\n      placeholder: '名字',\n      value: 'test'\n    }\n  },\n\n  methods: {\n    handleFieldChange(event) {\n      console.log(event);\n    },\n\n    handleFieldFocus(event) {\n      console.log(event);\n    },\n\n    handleFieldBlur(event) {\n      console.log(event);\n    }\n  }\n}));\n
\n

API

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
title输入框左侧标题，若传入为空，则不显示标题String-
name输入框的名字，作为 form 表单提交时数据的 keyStringcomponentId 指定的值
value输入框的内容String-
type输入框的类型，可选值为 input, textareaStringinput
inputType输入框为 input 情况下，输入框的类型，例如：number, text, passwordStringtext
placeholder输入框为空时占位符String
maxlength最大输入长度，设置为 -1 的时候不限制最大长度Number140
focus自动聚焦，拉起键盘Booleanfalse
disabled输入框是否禁用Booleanfalse
mode输入框展示样式，可选值为 wrapped, normalStringnormal
right输入框内容是否居右显示Booleanfalse
error是否显示为输入框错误情况下的样式Booleanfalse
componentId用于区分输入框之间的唯一名称String-
\n

Event

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
事件名称说明回调参数
change当绑定值变化时触发的事件event对象
focus输入框focusevent对象
blur输入框blurevent对象
\n

\n\n
\n ","label":"Field 输入框"} /***/ }), /***/ "../../packages/helper/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Helper 基础样式

\n

使用指南

\n

在 app.wxss 中引入组件库所有样式

\n
@import \"path/to/zanui-weapp/dist/index.wxss\";\n
\n

代码演示

\n

直接在元素上增加指定 class 即可

\n
<view class=\"zan-pull-right\">zan-pull-right: 往右靠</view>\n
\n

具体可用类名如下：

\n

字体大小

\n

zan-font-8 文字以8像素大小展示

\n

zan-font-10 文字以10像素大小展示

\n

zan-font-12 文字以12像素大小展示

\n

zan-font-14 文字以14像素大小展示

\n

zan-font-16 文字以16像素大小展示

\n

zan-font-18 文字以18像素大小展示

\n

zan-font-20 文字以20像素大小展示

\n

zan-font-22 文字以22像素大小展示

\n

zan-font-24 文字以24像素大小展示

\n

zan-font-30 文字以30像素大小展示

\n

字体颜色

\n

zan-c-red 文字以红色展示

\n

zan-c-gray 文字以浅灰色展示

\n

zan-c-gray-dark 文字以灰色展示

\n

zan-c-gray-darker 文字以深灰色展示

\n

zan-c-black 文字以黑色展示

\n

zan-c-blue 文字以蓝色展示

\n

zan-c-green 文字以绿色展示

\n

字体样式

\n

zan-pull-right 文字往右靠

\n

zan-text-deleted 文字显示删除效果

\n

zan-font-bold 文字加粗显示

\n

其他

\n

zan-arrow 展示向右侧箭头，以 absolute 布局，需要在外层加上 relative 来定位

\n

zan-ellipsis 文字过长点点点显示

\n

zan-ellipsis--l2 文字过长点点点显示，最多显示两行

\n

zan-ellipsis--l3 文字过长点点点显示，最多显示三行\n

\n\n
\n ","label":"Helper 基础样式"} /***/ }), /***/ "../../packages/icon/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Icon 图标

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-icon\": \"path/to/zanui-weapp/dist/icon/index\"\n  }\n}\n
\n

代码演示

\n

可以在任意位置上使用 zan-icon 标签。通过 type 可以控制 icon 显示的图标

\n
<zan-icon type=\"success\"></zan-icon>\n
\n

支持的 icon 和 名称 见下图

\n

\"\"\n\"\"\n\"\"\n\"\"\n\"\"\n

\n\n
\n ","label":"Icon 图标"} /***/ }), /***/ "../../packages/loading/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Loading 加载

\n

使用指南

\n

在 index.json 中引入组件

\n
  {\n    ...\n    \"usingComponents\": {\n      \"zan-loading\": \"../../dist/loading/index\"\n    }\n    ...\n  }\n
\n

在页面上直接使用 zan-loading 标签即可

\n
  <zan-loading type=\"circle\"></zan-loading>\n  <zan-loading type=\"spinner\" color=\"black\"></zan-loading>\n  <zan-loading type=\"dot\"></zan-loading>\n
\n

具体参数

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称类型是否必须默认描述
typeString否circleloading 类型，可支持 circle，spinner，dot
colorString否无可选值 black
useString，Number否1选择每种 Loading 类型的样式
\n

\n\n
\n ","label":"Loading 加载"} /***/ }), /***/ "../../packages/loadmore/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Loadmore 加载

\n

使用指南

\n

在 app.wxss 中引入组件库所有样式

\n
@import \"path/to/zanui-weapp/dist/index.wxss\";\n
\n

在需要使用的页面里引入组件库模板

\n
<import src=\"path/to/zanui-weapp/dist/loadmore/index.wxml\" />\n\n<!-- 直接使用 zan-loadmore 模板，并且直接传入设置值 -->\n<template is=\"zan-loadmore\" data=\"{{ loading: true }}\"></template>\n
\n

代码演示

\n

loadmore 支持三种状态，loading, nodata, nomore。传入指定的值即可显示

\n
<!-- 加载更多 -->\n<template is=\"zan-loadmore\" data=\"{{ loading: true }}\"></template>\n<!-- 没有可以显示的数据 -->\n<template is=\"zan-loadmore\" data=\"{{ nodata: true }}\"></template>\n<!-- 没有更多的数据了 -->\n<template is=\"zan-loadmore\" data=\"{{ nomore: true }}\"></template>\n
\n

\n\n
\n ","label":"Loadmore 加载"} /***/ }), /***/ "../../packages/noticebar/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Noticebar 通告栏

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-noticebar\": \"path/to/zanui-weapp/dist/noticebar/index\"\n  }\n}\n
\n

在 index.js 中声明组件数据

\n
// 在 Page 中声明 Noticebar 依赖的展示数据\nPage({\n  data: {\n    text: 'xxx',\n    scrollable: 'xxx',\n    ...\n  }\n})\n
\n

代码演示

\n

Noticebar 组件支持滚动和静止两种展示方式，通过 text 传入展示文案

\n

静止公告栏

\n
<zan-noticebar\n  text=\"{{ text }}\"\n/>\n
\n

滚动通告栏

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  scrollable=\"true\"\n/>\n
\n

延时滚动通告栏

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  scrollable=\"true\"\n  delay=\"{{ delay }}\"\n/>\n
\n

\b改变滚动通告栏滚动速度

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  scrollable=\"true\"\n  speed=\"{{ speed }}\"\n/>\n
\n

自定义通告栏字体颜色和背景色

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  color=\"{{ color }}\"\n  background-color=\"{{ backgroundColor }}\"\n/>\n
\n

添加左侧icon通告栏

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  left-icon=\"https://img.yzcdn.cn/public_files/2017/8/10/6af5b7168eed548100d9041f07b7c616.png\"\n/>\n
\n

可关闭通告栏

\n
<zan-noticebar\n  text=\"{{ text }}\"\n  mode=\"closeable\"\n/>\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值可选值
text通告栏展示文案String-
mode通告栏模式String''closeable
delay滚动延时时间Number0
speed滚动速度Number40
scrollable是否可滚动Booleanfalse
leftIcon左侧图标String-
color通告栏字体颜色String#f60
backgroundColor通告栏背景色String#fff7cc
\n

\n\n
\n ","label":"Noticebar 通告栏"} /***/ }), /***/ "../../packages/panel/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Panel 面板组件

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-panel\": \"/packages/panel/index\"\n  }\n}\n
\n

代码演示

\n

Panel 提供了一块白色的展示区域，使用方式如下

\n
<zan-panel title='我是标题'>\n  <view>内容</view>\n</zan-panel>\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
titlepanel的标题String-
hide-border内容区隐藏边框Boolean-
\n

\n\n
\n ","label":"Panel 面板组件"} /***/ }), /***/ "../../packages/popup/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Popup 弹出层

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-popup\": \"path/to/zanui-weapp/dist/popup/index\"\n  }\n}\n
\n

代码演示

\n

可以在页面任意位置上使用 zan-popup 标签。通过 show 可以控制弹窗是否展示

\n
<zan-popup show=\"{{ show }}\"></zan-popup>\n
\n

popup 动画

\n

popup 额外支持了 上下左右 四种动画方式，通过增加 type 属性即可控制。使用方式如下

\n
<!-- 从底部弹出的弹层 -->\n<zan-popup type=\"bottom\" show=\"{{ show }}\"></zan-popup>\n\n<!-- 从顶部弹出的弹层 -->\n<zan-popup type=\"top\" show=\"{{ show }}\"></zan-popup>\n\n<!-- 从左侧弹出的弹层 -->\n<zan-popup type=\"left\" show=\"{{ show }}\"></zan-popup>\n\n<!-- 从右侧弹出的弹层 -->\n<zan-popup type=\"right\" show=\"{{ show }}\"></zan-popup>\n
\n

控制显示，隐藏

\n
<zan-popup show=\"{{ isShow }}\" bindclose=\"togglePopup\"></zan-popup>\n
\n
data: {\n  isShow: false\n},\ntogglePopup() {\n  this.setData({\n    isShow: !this.data.isShow\n  });\n}\n
\n

具体参数和事件

\n

参数说明

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
show是否显示弹出层Booleanfalse
overlay是否显示遮罩层Booleanfalse
closeOnClickOverlay遮罩层点击时，是否触发关闭事件Booleantrue
type弹出层动画方式, 可选center, left, right, top, bottomStringcenter
\n

事件说明

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
事件名说明参数
click-overlay遮罩层点击触发
close遮罩层关闭时触发
\n

\n\n
\n ","label":"Popup 弹出层"} /***/ }), /***/ "../../packages/row/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Layout 布局

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-row\": \"path/to/zanui-weapp/dist/row/index\",\n    \"zan-col\": \"path/to/zanui-weapp/dist/col/index\"\n  }\n}\n
\n

代码演示

\n

Layout 组件提供了24列栅格，设置 col 属性可以设置元素所占宽度

\n
<zan-row>\n  <zan-col col=\"8\" col-class=\"custom-zan-col\">span: 8</zan-col>\n  <zan-col col=\"8\" col-class=\"custom-zan-col\">span: 8</zan-col>\n  <zan-col col=\"8\" col-class=\"custom-zan-col\">span: 8</zan-col>\n</zan-row>\n
\n

Layout 提供了 offset 功能。设置 offset 属性可以设置列的偏移宽度，计算方式与 span 相同

\n
<zan-row row-class=\"custom-zan-row\">\n  <zan-col col=\"4\" col-class=\"custom-zan-col\">span: 4</zan-col>\n  <zan-col col=\"10\" offset=\"4\" col-class=\"custom-zan-col\">offset: 4, span: 10</zan-col>\n</zan-row>\n<zan-row>\n  <zan-col col=\"12\" offset=\"12\" col-class=\"custom-zan-col\">offset: 12, span: 12</zan-col>\n</zan-row>\n
\n

API

\n

Row

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值
row-class自定义row classString-
\n

Col

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值
col-class自定义col classString-
col元素所占宽度Number0
offset元素偏移宽度Number0
\n

\n\n
\n ","label":"Layout 布局"} /***/ }), /***/ "../../packages/select/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Select 选择

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-select\": \"/packages/select/index\"\n  }\n}\n
\n

代码演示

\n
<zan-select\n  items=\"{{ items }}\"\n  checkedValue=\"{{ checkedValue }}\"\n  activeColor=\"{{ activeColor }}\"\n  bind:change=\"handleSelectChange\"\n/>\n
\n
Page({\n  data: {\n    items: [\n      {\n        value: '1',\n        // 选项文案\n        name: '选项一',\n      },\n      {\n        value: '2',\n        name: '选项二',\n      },\n    ],\n    checkedValue: '选项一',\n    activeColor: '#ff4443'\n  },\n\n  methods: {\n    handleSelectChange({ detail }) {\n      console.log(detail);\n    }\n  }\n});\n
\n

具体参数

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
itemsselect 显示各个项的配置Array-
checkedValue高亮的 item 的 value 值String-
activeColorSelect 高亮颜色String#ff4444
\n

items 具体格式如下

\n
{\n  items: [\n    {\n      // 选项选中时，代表的选中值。会以此作为唯一值，判断是否选中\n      value: '1',\n      // 选项的文字描述\n      name: '选项一',\n    },\n    {\n      value: '2',\n      name: '选项二',\n    },\n  ]\n}\n
\n

\n\n
\n ","label":"Select 选择"} /***/ }), /***/ "../../packages/stepper/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Stepper 计数器

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-stepper\": \"path/to/zanui-weapp/dist/stepper/index\"\n  }\n}\n
\n

代码演示

\n

基础用法

\n

Stepper 组件通过传入的 stepper 对象控制，内部数据格式如下：

\n
Page({\n  data: {\n    stepper: {\n      // 当前 stepper 数字\n      stepper: 1,\n      // 最小可到的数字\n      min: 1,\n      // 最大可到的数字\n      max: 1,\n      // 尺寸\n      size: 'small'\n    }\n  },\n\n  handleZanStepperChange({\n    // stepper 代表操作后，应该要展示的数字，需要设置到数据对象里，才会更新页面展示\n    detail: stepper\n  }) {\n    this.setData({\n      'stepper.stepper': stepper\n    });\n  }\n});\n
\n

当一个 Stepper 中，min 超过 max，就会导致组件被置灰。

\n

当 stepper 被点击时，需要监听change事件，处理计数器值的改变。

\n
<zan-stepper\n  stepper=\"{{ stepper.stepper }}\"\n  min=\"{{ stepper.min }}\"\n  max=\"{{ stepper.max }}\"\n  bind:change=\"handleZanStepperChange\"\n>\n</zan-stepper>\n
\n

API

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
size计数器尺寸：small、middle、largeStringmiddle
stepper计数器的值Number1必须
min计数器最小值Number1
max计数器最大值Number无穷大
step步数Number1
\n

Event

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
事件名称说明回调参数
change当绑定值变化时触发的事件{ index, stepper }
minus点击减少按钮时触发-
plus点击增加按钮时触发-
\n

\n\n
\n ","label":"Stepper 计数器"} /***/ }), /***/ "../../packages/steps/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Steps 步骤条

\n

使用指南

\n

在 app.wxss 中引入组件库所有样式

\n
@import \"path/to/zanui-weapp/dist/index.wxss\";\n
\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-steps\": \"path/to/zanui-weapp/dist/steps/index\"\n  }\n}\n
\n

代码演示

\n

基础用法

\n
<zan-steps type=\"horizon\" steps=\"{{steps}}\"></zan-steps>\n
\n

2步完成

\n
<zan-steps type=\"horizon\" steps=\"{{steps}}\"></zan-steps>\n
\n
steps: [\n  {\n      done: true,\n      current: false,\n      text: '步骤一',\n      desc: '10.01'\n    },\n    {\n      done: false,\n      current: true,\n      text: '步骤二',\n      desc: '10.02'\n    }\n]\n
\n

有描述的steps

\n
<zan-steps type=\"horizon\" hasDesc steps=\"{{steps}}\"></zan-steps>\n
\n

垂直方向的steps

\n
<zan-steps type=\"vertical\" steps=\"{{steps}}\"></zan-steps>\n
\n

自定义 class

\n
<zan-steps\n  steps-class=\"my-class\"\n  icon-class=\"gray\"\n  title-class=\"white\"\n  type=\"horizon\"\n  steps=\"{{steps}}\"\n></zan-steps>\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
typesteps 的展示状态，可选值为 'horizon', 'vertical'Stringhorizon
hasDesc是否展示描述Booleanfalse
steps步骤条展示数据Array必须
steps-class自定义类，可改变steps外层样式String
icon-class自定义类，可改变icon样式String
title-class自定义类，可改变标题样式String
desc-class自定义类，可改变描述样式String
\n

steps 数据格式如下：

\n
[\n  {\n    // 此步骤是否当前完成状态\n    current: false,\n    // 此步骤是否已经完成\n    done: true,\n    // 此步骤显示文案\n    text: '步骤一',\n    // 此步骤描述语\n    desc: '10.01'\n  },\n  {\n    done: true,\n    current: false,\n    text: '步骤二',\n    desc: '10.02'\n  },\n  {\n    done: true,\n    current: true,\n    text: '步骤三',\n    desc: '10.03'\n  }\n]\n
\n

\n\n
\n ","label":"Steps 步骤条"} /***/ }), /***/ "../../packages/switch/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Switch 开关

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-switch\": \"/packages/switch/index\"\n  }\n}\n
\n

代码演示

\n

=======

\n
<zan-switch\n  disabled=\"{{ disabled }}\"\n  checked=\"{{ checked }}\"\n  loading=\"{{ loading }}\"\n  bind:change=\"handleFieldChange\"\n></zan-switch>\n
\n
Page({\n  data: {\n    disabled: false,\n    checked: false,\n    loading: false\n  },\n\n  methods: {\n    handleFieldChange(event, data) {\n      console.log(event, data);\n    }\n  }\n});\n
\n

API

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
loadingswitch 是否是 loading 状态Booleanfalse
disabled是否不可用Booleanfalse
checked是否打开状态Booleanfalse必须
\n

Event

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
事件名称说明回调参数
change当绑定值变化时触发的事件event对象和数据对象（包含loading和checked）
\n

\n\n
\n ","label":"Switch 开关"} /***/ }), /***/ "../../packages/tab/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Tab 标签

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-tab\": \"path/to/zanui-weapp/dist/tab/index\"\n  }\n}\n
\n

在 index.js 中声明组件数据

\n
// 在 Page 中声明 Tab 依赖的展示数据\nPage({\n  data: {\n    list: [{\n      id: 'xxx',\n      title: 'xxx'\n    }],\n    selectedId: 'xxx',\n    ...\n  }\n})\n
\n

代码演示

\n

可以在任意位置上使用 zan-tab 标签。传入对应的数据即可。

\n
<zan-tab\n  scroll=\"{{ scroll }}\"\n  list=\"{{ list }}\"\n  selected-id=\"{{ selectedId }}\"\n  height=\"{{ height }}\"\n  fixed=\"{{ fixed }}\"\n  bindtabchange=\"handleTabChange\"\n/>\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值必须
scroll是否开启 tab 左右滑动模式Boolean-
list可选项列表Array-
selectedId选中id--
heighttab高度Number-
fixed是否固定位置Boolean-
\n

tab 组件中，list 数据格式如下

\n
[{\n  // tab 项 id\n  id: 'all',\n  // tab 项展示文案\n  title: '全部'\n}, {\n  id: 'topay',\n  title: '待付款'\n}, {\n  id: 'tosend',\n  title: '待发货'\n}, {\n  id: 'send',\n  title: '待收货'\n}, {\n  id: 'sign',\n  title: '已完成'\n}]\n
\n

可以监听 bindtabchange 事件回调，在页面注册回调函数

\n
Page({\n  customCallback(selectedId) {\n    // selectId 表示被选中 tab 项的 id\n  }\n}));\n
\n

\n\n
\n ","label":"Tab 标签"} /***/ }), /***/ "../../packages/tag/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Tag 标签

\n

使用指南

\n

在 json 文件中配置tag组件

\n
\"usingComponents\": {\n  \"zan-tag\": \"/dist/tag/index\"\n}\n
\n

属性

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
名称类型是否必须默认描述
typeString否空tag类型，值有primary、warn、danger
plainBoolean否false\btag是否镂空，默认为false
disabledBoolean否falsetag是否禁用，默认为false
\n

代码演示

\n

基础用法

\n
<zan-tag>取消订单</zan-tag>\n
\n

类型

\n

tag支持额外的三种类型 primary, danger, warn

\n
<zan-tag type=\"primary\">会员折扣</zan-tag>\n<zan-tag type=\"danger\">返现</zan-tag>\n<zan-tag type=\"warn\">返现</zan-tag>\n
\n

其他

\n

tag镂空状态

\n
<zan-tag plain>返现</zan-tag>\n
\n

tag禁用状态

\n
<zan-tag disabled>不可用</zan-tag>\n
\n

\n\n
\n ","label":"Tag 标签"} /***/ }), /***/ "../../packages/toast/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

Toast 轻提示

\n

使用指南

\n

在 json 文件中配置 toast 组件

\n
\"usingComponents\": {\n  \"zan-toast\": \"/path/to/zanui-weapp/dist/toast/index\"\n}\n
\n

在需要使用的页面里引入组件库模板和脚本

\n
<zan-toast id=\"zan-toast-test\"></zan-toast>\n
\n
const Toast = require('path/to/zanui-weapp/dist/toast/toast');\n\nPage({\n  // ...\n  // 可以在任意方法里直接调用，即可唤起\n  handleClick() {\n    Toast({\n      message: 'toast me',\n      selector: '#zan-toast-test'\n    });\n  }\n});\n
\n

加载提示

\n
Toast.loading({\n  selector: '#zan-toast-test'\n});\n
\n

参数说明

\n

方法

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
方法名参数返回值介绍
Toastoptions, timeout-展示提示
Toast.loadingoptions-展示加载提示
Toast.clear--关闭提示
Toast.setDefaultOptionsoptions 格式同 Toast 函数可以传入的参数, type 可选 global/page, 分别指定对整个小程序生效/对当前页面生效-修改默认配置，对所有 Toast 生效
Toast.resetDefaultOptionstype 可选 global/page-重置默认配置，对所有 Toast 生效
\n

options 具体参数如下

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值可选值
messagetoast 显示文案String-
type提示类型String-loading success fail
icontoast 显示图标，可以用 icon 里面支持的所有图标String--
imagetoast 显示图标，为图片的链接，传入此值后会覆盖 icon 值String-
timeouttoast 显示时间，小于0则会一直显示，需要手动调用 clearZanToast 清除Number-
\n

\n\n
\n ","label":"Toast 轻提示"} /***/ }), /***/ "../../packages/toptips/README.md": /***/ (function(module, exports) { module.exports = {"template":"\n
\n

TopTips 顶部提示

\n

使用指南

\n

在 index.json 中引入组件

\n
{\n  \"usingComponents\": {\n    \"zan-toptips\": \"path/to/zanui-weapp/dist/toptips/index\"\n  }\n}\n
\n

在 index.js 中声明组件数据

\n

toptips提供了声明式和命令式2种调用方式，但是由于小程序本身限制，会有一定使用的要求

\n
// 使用声明式调用的方式， 必须在Page中声明 $zanui对象， 结构如下\n// 同时在其他触发toptips显示的函数中，需要手动改变对应的数值\nPage({\n  data: {\n    duration: 1000,\n    content: 'xxx',\n    $zanui: {\n      toptips: {\n        show: false\n      }\n    }\n  }\n})\n\n// 使用命令式调用的方式，必须在 wxml 模板中声明组件id，\n// 默认我们使用了 zan-toptips， 如果使用者要更换，可以手动传入\n// 注意和 usingComponents 里引用的路径不一样\nconst Toptips = require('path/to/zanui-weapp/dist/toptips/toptips');\nPage({\n  customCallback() {\n    Toptips('只传文案展示');\n  }\n})\n\n
\n

代码演示

\n

声明式调用

\n

使用声明式调用

\n
Page({\n  data: {\n    duration: 1000,\n    content: 'xxx',\n    $zanui: {\n      toptips: {\n        show: false\n      }\n    }\n  },\n\n  customCallback() {\n    this.setData({\n      $zanui: {\n        toptips: {\n          show: true\n        }\n      }\n    });\n\n    setTimeout(() => {\n      this.setData({\n        $zanui: {\n          toptips: {\n            show: false\n          }\n        }\n      })\n    }, this.data.duration);\n  }\n})\n
\n
<zan-toptips\n  content=\"tip内容\"\n  duration=\"{{ duration }}\"\n  is-show=\"{{ $zanui.toptips.show }}\"\n/>\n
\n

命令式调用

\n
Page({\n  customCallback() {\n    Toptips('我只改文案')\n  }\n})\n
\n
<zan-toptips\n  id=\"zan-toptips\"\n  contetn=\"{{ content }}\"\n/>\n
\n

修改组件id

\n
Page({\n  customCallback() {\n    Toptips({\n      content: '传入其他参数',\n      selector: '#other-id',\n      duration: 5000\n    })\n  }\n})\n
\n
<zan-toptips\n  id=\"other-id\"\n  contetn=\"{{ content }}\"\n/>\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
参数说明类型默认值可选值
content展示文案String-
duration弹层持续时间Number3000
isShow弹层是否展示Booleanfalse
color字体颜色String#fff
backgroundColor提示背景色String#e64340
\n\n
\n ","label":"TopTips 顶部提示"} /***/ }), /***/ "../../website/node_modules/css-loader/index.js?{\"sourceMap\":true}!../vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-7a5a90c9\",\"scoped\":true,\"hasInlineConfig\":false}!../vue-loader/lib/selector.js?type=styles&index=0!../../website/plugins/components/WxappPage.vue": /***/ (function(module, exports, __webpack_require__) { exports = module.exports = __webpack_require__("../../website/node_modules/css-loader/lib/css-base.js")(true); // imports // module exports.push([module.i, "\ncode.language-wxml[data-v-7a5a90c9]::after {\n content: 'WXML';\n}\ncode.language-js[data-v-7a5a90c9]::after {\n content: 'JS';\n}\ncode.language-wxss[data-v-7a5a90c9]::after {\n content: 'WXSS';\n}\ncode.language-json[data-v-7a5a90c9]::after {\n content: 'JSON';\n}\n\n/* .demo {\n margin-top: 15px;\n}\n.demo-code {\n height: 500px;\n overflow: auto;\n background-color: #f5f7fa;\n}\n.code-type-tabs {\n display: flex;\n justify-content: center;\n text-align: center;\n}\n.code-type-tab {\n flex: 1;\n}\n.language-js, .language-wxml, .language-wxss, .language-json {\n display: none;\n}\n.js .language-js {\n display: block;\n}\n.json .language-json {\n display: block;\n}\n.wxml .language-wxml {\n display: block;\n}\n.wxss .language-wxss {\n display: block;\n}\npre + pre {\n margin-top: 0;\n} */\n", "", {"version":3,"sources":["/Users/chenyao/youzan/weapp/zanui-weapp/website/plugins/components/WxappPage.vue"],"names":[],"mappings":";AACA;EACE,gBAAgB;CACjB;AACD;EACE,cAAc;CACf;AACD;EACE,gBAAgB;CACjB;AACD;EACE,gBAAgB;CACjB;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAiCI","file":"WxappPage.vue","sourcesContent":["\ncode.language-wxml[data-v-7a5a90c9]::after {\n content: 'WXML';\n}\ncode.language-js[data-v-7a5a90c9]::after {\n content: 'JS';\n}\ncode.language-wxss[data-v-7a5a90c9]::after {\n content: 'WXSS';\n}\ncode.language-json[data-v-7a5a90c9]::after {\n content: 'JSON';\n}\n\n/* .demo {\n margin-top: 15px;\n}\n.demo-code {\n height: 500px;\n overflow: auto;\n background-color: #f5f7fa;\n}\n.code-type-tabs {\n display: flex;\n justify-content: center;\n text-align: center;\n}\n.code-type-tab {\n flex: 1;\n}\n.language-js, .language-wxml, .language-wxss, .language-json {\n display: none;\n}\n.js .language-js {\n display: block;\n}\n.json .language-json {\n display: block;\n}\n.wxml .language-wxml {\n display: block;\n}\n.wxss .language-wxss {\n display: block;\n}\npre + pre {\n margin-top: 0;\n} */\n"],"sourceRoot":""}]); // exports /***/ }), /***/ "../../website/node_modules/css-loader/lib/css-base.js": /***/ (function(module, exports) { /* MIT License http://www.opensource.org/licenses/mit-license.php Author Tobias Koppers @sokra */ // css base code, injected by the css-loader module.exports = function(useSourceMap) { var list = []; // return the list of modules as css string list.toString = function toString() { return this.map(function (item) { var content = cssWithMappingToString(item, useSourceMap); if(item[2]) { return "@media " + item[2] + "{" + content + "}"; } else { return content; } }).join(""); }; // import a list of modules into the list list.i = function(modules, mediaQuery) { if(typeof modules === "string") modules = [[null, modules, ""]]; var alreadyImportedModules = {}; for(var i = 0; i < this.length; i++) { var id = this[i][0]; if(typeof id === "number") alreadyImportedModules[id] = true; } for(i = 0; i < modules.length; i++) { var item = modules[i]; // skip already imported module // this implementation is not 100% perfect for weird media query combinations // when a module is imported multiple times with different media queries. // I hope this will never occur (Hey this way we have smaller bundles) if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) { if(mediaQuery && !item[2]) { item[2] = mediaQuery; } else if(mediaQuery) { item[2] = "(" + item[2] + ") and (" + mediaQuery + ")"; } list.push(item); } } }; return list; }; function cssWithMappingToString(item, useSourceMap) { var content = item[1] || ''; var cssMapping = item[3]; if (!cssMapping) { return content; } if (useSourceMap && typeof btoa === 'function') { var sourceMapping = toComment(cssMapping); var sourceURLs = cssMapping.sources.map(function (source) { return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */' }); return [content].concat(sourceURLs).concat([sourceMapping]).join('\n'); } return [content].join('\n'); } // Adapted from convert-source-map (MIT) function toComment(sourceMap) { // eslint-disable-next-line no-undef var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))); var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64; return '/*# ' + data + ' */'; } /***/ }), /***/ "../../website/node_modules/vue-style-loader/index.js!../../website/node_modules/css-loader/index.js?{\"sourceMap\":true}!../vue-loader/lib/style-compiler/index.js?{\"vue\":true,\"id\":\"data-v-7a5a90c9\",\"scoped\":true,\"hasInlineConfig\":false}!../vue-loader/lib/selector.js?type=styles&index=0!../../website/plugins/components/WxappPage.vue": /***/ (function(module, exports, __webpack_require__) { // style-loader: Adds some css to the DOM by adding a