├── .babelrc
├── .gitignore
├── README.md
├── dist
├── build.js
└── build.js.map
├── index.html
├── package.json
├── src
├── App.vue
├── assets
│ ├── avatar1.png
│ ├── avatar2.png
│ ├── logo.png
│ └── wyz.jpg
├── components
│ ├── scrollLoader.vue
│ └── wxChat.vue
└── main.js
└── webpack.config.js
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | ["env", { "modules": false }]
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules/
3 | npm-debug.log
4 | yarn-error.log
5 |
6 | # Editor directories and files
7 | .idea
8 | *.suo
9 | *.ntvs*
10 | *.njsproj
11 | *.sln
12 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # vue-wxchat
2 |
3 | > A WeChat front-end view component
4 |
5 | ## Build Setup
6 |
7 | ``` bash
8 | # install dependencies
9 | npm install
10 |
11 | # serve with hot reload at localhost:8080
12 | npm run dev
13 |
14 | # build for production with minification
15 | npm run build
16 | ```
17 |
18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader).
19 | > 源码：[https://github.com/doterlin/vue-wxChat](https://github.com/doterlin/vue-wxChat)
20 | > 演示地址：[https://doterlin.github.io/vue-wxChat/](https://doterlin.github.io/vue-wxChat/)
21 |
22 | 
23 |
24 | ## 运行
25 |
26 | ``` bash
27 | # install dependencies
28 | npm install
29 |
30 | # serve with hot reload at localhost:8080
31 | npm run dev
32 |
33 | # build for production with minification
34 | npm run build
35 | ```
36 | ## 介绍
37 | + 支持文本和图片的展示（后续将支持对`语音类`的展示）。
38 | + 支持`滚动加载数据`，其中滚动加载依赖我另外一个组件scrollLoader.vue（《[Vue.js上下滚动加载组件](http://www.jianshu.com/p/1a1476a0eab5)》）。
39 | + 支持QQ表情，为了能使用表情请全局注册指令`v-emotion`,我在`main.js`做了实现；代码如下：
40 |
41 | ```
42 | function toEmotion(text, isNoGif){
43 | var list = ['微笑', '撇嘴', '色', '发呆', '得意', '流泪', '害羞', '闭嘴', '睡', '大哭', '尴尬', '发怒', '调皮', '呲牙', '惊讶', '难过', '酷', '冷汗', '抓狂', '吐', '偷笑', '愉快', '白眼', '傲慢', '饥饿', '困', '惊恐', '流汗', '憨笑', '大兵', '奋斗', '咒骂', '疑问', '嘘', '晕', '折磨', '衰', '骷髅', '敲打', '再见', '擦汗', '抠鼻', '鼓掌', '糗大了', '坏笑', '左哼哼', '右哼哼', '哈欠', '鄙视', '委屈', '快哭了', '阴险', '亲亲', '吓', '可怜', '菜刀', '西瓜', '啤酒', '篮球', '乒乓', '咖啡', '饭', '猪头', '玫瑰', '凋谢', '示爱', '爱心', '心碎', '蛋糕', '闪电', '炸弹', '刀', '足球', '瓢虫', '便便', '月亮', '太阳', '礼物', '拥抱', '强', '弱', '握手', '胜利', '抱拳', '勾引', '拳头', '差劲', '爱你', 'NO', 'OK', '爱情', '飞吻', '跳跳', '发抖', '怄火', '转圈', '磕头', '回头', '跳绳', '挥手', '激动', '街舞', '献吻', '左太极', '右太极', '嘿哈', '捂脸', '奸笑', '机智', '皱眉', '耶', '红包', '鸡'];
44 | if (!text) {
45 | return text;
46 | }
47 |
48 | text = text.replace(/\[[\u4E00-\u9FA5]{1,3}\]/gi, function(word){
49 | var newWord = word.replace(/\[|\]/gi,'');
50 | var index = list.indexOf(newWord);
51 | var backgroundPositionX = -index * 24
52 | var imgHTML = '';
53 | if(index<0){
54 | return word;
55 | }
56 |
57 | if (isNoGif) {
58 | if(index>104){
59 | return word;
60 | }
61 | imgHTML = ``
62 | } else {
63 | var path = index>104 ? '/img' : 'https://res.wx.qq.com/mpres/htmledition/images/icon';
64 | imgHTML = ``
65 | }
66 | return imgHTML;
67 | });
68 | return text;
69 | }
70 |
71 |
72 | Vue.directive('emotion', {
73 | bind: function (el, binding) {
74 | el.innerHTML = toEmotion(binding.value)
75 | }
76 | });
77 | ```
78 |
79 | ##如何使用?
80 | 参数已经在组件中做了说明，并在`App.vue`中做了演示：
81 | 参数和说明：
82 | **微信聊天可视化组件**
83 | **依赖scrollLoader组件, 依赖指令v-emotion（实现请查看main.js）**
84 |
85 | **参数**：
86 | `width` 组件宽度，默认450
87 | `wrapBg` 外层父元素背景颜色，默认#efefef
88 | `maxHeight` 展示窗口最高高度, 默认900
89 | `contactAvatarUrl` 好友头像url
90 | `ownerAvatarUrl` 微信主人头像url
91 | `ownerNickname` 微信主人昵称
92 | `getUpperData` （必需）当滚动到上方时加载数据的方法，返回值要为Promise对象，resolve的结构同data
93 | `getUnderData` （必需）当滚动到下方时加载数据的方法，返回值同上
94 | `data` （必需）传入初始化数据， 结构如下：
95 | ```
96 | [{
97 | direction: 2, //为2表示微信主人发出的消息，1表示联系人
98 | id: 1, //根据这个来排序消息
99 | type: 1, //1为文本，2为图片
100 | content: '你好!![呲牙]', //当type为1时这里是文本消息，当type2为2时这里要存放图片地址；后续会支持语音的显示
101 | ctime: new Date().toLocaleString() //显示当前消息的发送时间
102 | },
103 | {
104 | direction: 1,
105 | id: 2,
106 | type: 1,
107 | content: '你也好。[害羞]',
108 | ctime: new Date().toLocaleString()
109 | }]
110 | ```
111 | ## 完整的使用实例
112 | 效果：[https://doterlin.github.io/vue-wxChat/](https://doterlin.github.io/vue-wxChat/)
113 | 代码：
114 | ```
115 | //主文件，对wxChat的用法做示例
116 |
117 |
118 |
127 |
128 |
129 |
130 |
261 |
262 |
290 |
291 | ```
292 | 欢迎 start:
293 | [https://github.com/doterlin/vue-wxChat](https://github.com/doterlin/vue-wxChat)
294 |
--------------------------------------------------------------------------------
/dist/build.js:
--------------------------------------------------------------------------------
1 | !function(t){function e(r){if(n[r])return n[r].exports;var i=n[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,e),i.l=!0,i.exports}var n={};e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="/dist/",e(e.s=8)}([function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;en.parts.length&&(r.parts.length=n.parts.length)}else{for(var a=[],i=0;i=0&&Math.floor(e)===e&&isFinite(t)}function f(t){return null==t?"":"object"==typeof t?JSON.stringify(t,null,2):String(t)}function d(t){var e=parseFloat(t);return isNaN(e)?t:e}function p(t,e){for(var n=Object.create(null),r=t.split(","),i=0;i-1)return t.splice(n,1)}}function h(t,e){return Hi.call(t,e)}function m(t){var e=Object.create(null);return function(n){return e[n]||(e[n]=t(n))}}function g(t,e){function n(n){var r=arguments.length;return r?r>1?t.apply(e,arguments):t.call(e,n):t.call(e)}return n._length=t.length,n}function y(t,e){e=e||0;for(var n=t.length-e,r=new Array(n);n--;)r[n]=t[n+e];return r}function _(t,e){for(var n in e)t[n]=e[n];return t}function b(t){for(var e={},n=0;nBo&&Po[n].id>t.id;)n--;Po.splice(n+1,0,t)}else Po.push(t);Fo||(Fo=!0,bo(Tt))}}function Dt(t){qo.clear(),It(t,qo)}function It(t,e){var n,r,i=Array.isArray(t);if((i||s(t))&&Object.isExtensible(t)){if(t.__ob__){var o=t.__ob__.dep.id;if(e.has(o))return;e.add(o)}if(i)for(n=t.length;n--;)It(t[n],e);else for(r=Object.keys(t),n=r.length;n--;)It(t[r[n]],e)}}function Mt(t,e,n){Ko.get=function(){return this[e][n]},Ko.set=function(t){this[e][n]=t},Object.defineProperty(t,n,Ko)}function Pt(t){t._watchers=[];var e=t.$options;e.props&&Rt(t,e.props),e.methods&&Vt(t,e.methods),e.data?Ut(t):D(t._data={},!0),e.computed&&Ht(t,e.computed),e.watch&&e.watch!==fo&&qt(t,e.watch)}function Rt(t,e){var n=t.$options.propsData||{},r=t._props={},i=t.$options._propKeys=[],o=!t.$parent;Oo.shouldConvert=o;for(var a in e)!function(o){i.push(o);var a=W(o,e,n,t);I(r,o,a),o in t||Mt(t,"_props",o)}(a);Oo.shouldConvert=!0}function Ut(t){var e=t.$options.data;e=t._data="function"==typeof e?Ft(e,t):e||{},c(e)||(e={});for(var n=Object.keys(e),r=t.$options.props,i=(t.$options.methods,n.length);i--;){var o=n[i];r&&h(r,o)||k(o)||Mt(t,"_data",o)}D(e,!0)}function Ft(t,e){try{return t.call(e)}catch(t){return S(t,e,"data()"),{}}}function Ht(t,e){var n=t._computedWatchers=Object.create(null);for(var r in e){var i=e[r],o="function"==typeof i?i:i.get;n[r]=new Vo(t,o,x,Jo),r in t||Bt(t,r,i)}}function Bt(t,e,n){"function"==typeof n?(Ko.get=zt(e),Ko.set=x):(Ko.get=n.get?!1!==n.cache?zt(e):n.get:x,Ko.set=n.set?n.set:x),Object.defineProperty(t,e,Ko)}function zt(t){return function(){var e=this._computedWatchers&&this._computedWatchers[t];if(e)return e.dirty&&e.evaluate(),wo.target&&e.depend(),e.value}}function Vt(t,e){t.$options.props;for(var n in e)t[n]=null==e[n]?x:g(e[n],t)}function qt(t,e){for(var n in e){var r=e[n];if(Array.isArray(r))for(var i=0;i=0||n.indexOf(t[i])<0)&&r.push(t[i]);return r}return t}function xe(t){this._init(t)}function we(t){t.use=function(t){var e=this._installedPlugins||(this._installedPlugins=[]);if(e.indexOf(t)>-1)return this;var n=y(arguments,1);return n.unshift(this),"function"==typeof t.install?t.install.apply(t,n):"function"==typeof t&&t.apply(null,n),e.push(t),this}}function $e(t){t.mixin=function(t){return this.options=K(this.options,t),this}}function Ce(t){t.cid=0;var e=1;t.extend=function(t){t=t||{};var n=this,r=n.cid,i=t._Ctor||(t._Ctor={});if(i[r])return i[r];var o=t.name||n.options.name,a=function(t){this._init(t)};return a.prototype=Object.create(n.prototype),a.prototype.constructor=a,a.cid=e++,a.options=K(n.options,t),a.super=n,a.options.props&&ke(a),a.options.computed&&Ae(a),a.extend=n.extend,a.mixin=n.mixin,a.use=n.use,Zi.forEach(function(t){a[t]=n[t]}),o&&(a.options.components[o]=a),a.superOptions=n.options,a.extendOptions=t,a.sealedOptions=_({},a.options),i[r]=a,a}}function ke(t){var e=t.options.props;for(var n in e)Mt(t.prototype,"_props",n)}function Ae(t){var e=t.options.computed;for(var n in e)Bt(t.prototype,n,e[n])}function Oe(t){Zi.forEach(function(e){t[e]=function(t,n){return n?("component"===e&&c(n)&&(n.name=n.name||t,n=this.options._base.extend(n)),"directive"===e&&"function"==typeof n&&(n={bind:n,update:n}),this.options[e+"s"][t]=n,n):this.options[e+"s"][t]}})}function Se(t){return t&&(t.Ctor.options.name||t.tag)}function Te(t,e){return Array.isArray(t)?t.indexOf(e)>-1:"string"==typeof t?t.split(",").indexOf(e)>-1:!!l(t)&&t.test(e)}function Le(t,e,n){for(var r in t){var i=t[r];if(i){var o=Se(i.componentOptions);o&&!n(o)&&(i!==e&&Ee(i),t[r]=null)}}}function Ee(t){t&&t.componentInstance.$destroy()}function je(t){for(var e=t.data,n=t,i=t;r(i.componentInstance);)i=i.componentInstance._vnode,i.data&&(e=Ne(i.data,e));for(;r(n=n.parent);)n.data&&(e=Ne(e,n.data));return De(e.staticClass,e.class)}function Ne(t,e){return{staticClass:Ie(t.staticClass,e.staticClass),class:r(t.class)?[t.class,e.class]:e.class}}function De(t,e){return r(t)||r(e)?Ie(t,Me(e)):""}function Ie(t,e){return t?e?t+" "+e:t:e||""}function Me(t){return Array.isArray(t)?Pe(t):s(t)?Re(t):"string"==typeof t?t:""}function Pe(t){for(var e,n="",i=0,o=t.length;i-1?ka[t]=e.constructor===window.HTMLUnknownElement||e.constructor===window.HTMLElement:ka[t]=/HTMLUnknownElement/.test(e.toString())}function He(t){if("string"==typeof t){var e=document.querySelector(t);return e||document.createElement("div")}return t}function Be(t,e){var n=document.createElement(t);return"select"!==t?n:(e.data&&e.data.attrs&&void 0!==e.data.attrs.multiple&&n.setAttribute("multiple","multiple"),n)}function ze(t,e){return document.createElementNS(ba[t],e)}function Ve(t){return document.createTextNode(t)}function qe(t){return document.createComment(t)}function Ke(t,e,n){t.insertBefore(e,n)}function Je(t,e){t.removeChild(e)}function We(t,e){t.appendChild(e)}function Ge(t){return t.parentNode}function Ze(t){return t.nextSibling}function Xe(t){return t.tagName}function Ye(t,e){t.textContent=e}function Qe(t,e,n){t.setAttribute(e,n)}function tn(t,e){var n=t.data.ref;if(n){var r=t.context,i=t.componentInstance||t.elm,o=r.$refs;e?Array.isArray(o[n])?v(o[n],i):o[n]===i&&(o[n]=void 0):t.data.refInFor?Array.isArray(o[n])?o[n].indexOf(i)<0&&o[n].push(i):o[n]=[i]:o[n]=i}}function en(t,e){return t.key===e.key&&(t.tag===e.tag&&t.isComment===e.isComment&&r(t.data)===r(e.data)&&nn(t,e)||i(t.isAsyncPlaceholder)&&t.asyncFactory===e.asyncFactory&&n(e.asyncFactory.error))}function nn(t,e){if("input"!==t.tag)return!0;var n;return(r(n=t.data)&&r(n=n.attrs)&&n.type)===(r(n=e.data)&&r(n=n.attrs)&&n.type)}function rn(t,e,n){var i,o,a={};for(i=e;i<=n;++i)o=t[i].key,r(o)&&(a[o]=i);return a}function on(t,e){(t.data.directives||e.data.directives)&&an(t,e)}function an(t,e){var n,r,i,o=t===Sa,a=e===Sa,s=sn(t.data.directives,t.context),c=sn(e.data.directives,e.context),l=[],u=[];for(n in c)r=s[n],i=c[n],r?(i.oldValue=r.value,ln(i,"update",e,t),i.def&&i.def.componentUpdated&&u.push(i)):(ln(i,"bind",e,t),i.def&&i.def.inserted&&l.push(i));if(l.length){var f=function(){for(var n=0;n=0&&" "===(m=t.charAt(h));h--);m&&Ia.test(m)||(u=!0)}}else void 0===o?(v=i+1,o=t.slice(0,i).trim()):e();if(void 0===o?o=t.slice(0,i).trim():0!==v&&e(),a)for(i=0;i=na}function Sn(t){return 34===t||39===t}function Tn(t){var e=1;for(aa=oa;!On();)if(t=An(),Sn(t))Ln(t);else if(91===t&&e++,93===t&&e--,0===e){sa=oa;break}}function Ln(t){for(var e=t;!On()&&(t=An())!==e;);}function En(t,e,n){ca=n;var r=e.value,i=e.modifiers,o=t.tag,a=t.attrsMap.type;if(t.component)return $n(t,r,i),!1;if("select"===o)Dn(t,r,i);else if("input"===o&&"checkbox"===a)jn(t,r,i);else if("input"===o&&"radio"===a)Nn(t,r,i);else if("input"===o||"textarea"===o)In(t,r,i);else if(!Yi.isReservedTag(o))return $n(t,r,i),!1;return!0}function jn(t,e,n){var r=n&&n.number,i=xn(t,"value")||"null",o=xn(t,"true-value")||"true",a=xn(t,"false-value")||"false";gn(t,"checked","Array.isArray("+e+")?_i("+e+","+i+")>-1"+("true"===o?":("+e+")":":_q("+e+","+o+")")),bn(t,Pa,"var $$a="+e+",$$el=$event.target,$$c=$$el.checked?("+o+"):("+a+");if(Array.isArray($$a)){var $$v="+(r?"_n("+i+")":i)+",$$i=_i($$a,$$v);if($$c){$$i<0&&("+e+"=$$a.concat($$v))}else{$$i>-1&&("+e+"=$$a.slice(0,$$i).concat($$a.slice($$i+1)))}}else{"+Cn(e,"$$c")+"}",null,!0)}function Nn(t,e,n){var r=n&&n.number,i=xn(t,"value")||"null";i=r?"_n("+i+")":i,gn(t,"checked","_q("+e+","+i+")"),bn(t,Pa,Cn(e,i),null,!0)}function Dn(t,e,n){var r=n&&n.number,i='Array.prototype.filter.call($event.target.options,function(o){return o.selected}).map(function(o){var val = "_value" in o ? o._value : o.value;return '+(r?"_n(val)":"val")+"})",o="var $$selectedVal = "+i+";";o=o+" "+Cn(e,"$event.target.multiple ? $$selectedVal : $$selectedVal[0]"),bn(t,"change",o,null,!0)}function In(t,e,n){var r=t.attrsMap.type,i=n||{},o=i.lazy,a=i.number,s=i.trim,c=!o&&"range"!==r,l=o?"change":"range"===r?Ma:"input",u="$event.target.value";s&&(u="$event.target.value.trim()"),a&&(u="_n("+u+")");var f=Cn(e,u);c&&(f="if($event.target.composing)return;"+f),gn(t,"value","("+e+")"),bn(t,l,f,null,!0),(s||a)&&bn(t,"blur","$forceUpdate()")}function Mn(t){var e;r(t[Ma])&&(e=oo?"change":"input",t[e]=[].concat(t[Ma],t[e]||[]),delete t[Ma]),r(t[Pa])&&(e=uo?"click":"change",t[e]=[].concat(t[Pa],t[e]||[]),delete t[Pa])}function Pn(t,e,n,r,i){if(n){var o=e,a=la;e=function(n){null!==(1===arguments.length?o(n):o.apply(null,arguments))&&Rn(t,e,r,a)}}la.addEventListener(t,e,po?{capture:r,passive:i}:r)}function Rn(t,e,n,r){(r||la).removeEventListener(t,e,n)}function Un(t,e){var i=r(e.componentOptions),o=i?t.data.nativeOn:t.data.on,a=i?e.data.nativeOn:e.data.on;n(o)&&n(a)||(a=a||{},o=o||{},la=e.elm,Mn(a),nt(a,o,Pn,Rn,e.context))}function Fn(t,e){if(!n(t.data.domProps)||!n(e.data.domProps)){var i,o,a=e.elm,s=t.data.domProps||{},c=e.data.domProps||{};r(c.__ob__)&&(c=e.data.domProps=_({},c));for(i in s)n(c[i])&&(a[i]="");for(i in c)if(o=c[i],"textContent"!==i&&"innerHTML"!==i||(e.children&&(e.children.length=0),o!==s[i]))if("value"===i){a._value=o;var l=n(o)?"":String(o);Hn(a,e,l)&&(a.value=l)}else a[i]=o}}function Hn(t,e,n){return!t.composing&&("option"===e.tag||Bn(t,n)||zn(t,n))}function Bn(t,e){return document.activeElement!==t&&t.value!==e}function zn(t,e){var n=t.value,i=t._vModifiers;return r(i)&&i.number?d(n)!==d(e):r(i)&&i.trim?n.trim()!==e.trim():n!==e}function Vn(t){var e=qn(t.style);return t.staticStyle?_(t.staticStyle,e):e}function qn(t){return Array.isArray(t)?b(t):"string"==typeof t?Fa(t):t}function Kn(t,e){var n,r={};if(e)for(var i=t;i.componentInstance;)i=i.componentInstance._vnode,i.data&&(n=Vn(i.data))&&_(r,n);(n=Vn(t.data))&&_(r,n);for(var o=t;o=o.parent;)o.data&&(n=Vn(o.data))&&_(r,n);return r}function Jn(t,e){var i=e.data,o=t.data;if(!(n(i.staticStyle)&&n(i.style)&&n(o.staticStyle)&&n(o.style))){var a,s,c=e.elm,l=o.staticStyle,u=o.normalizedStyle||o.style||{},f=l||u,d=qn(e.data.style)||{};e.data.normalizedStyle=r(d.__ob__)?_({},d):d;var p=Kn(e,!0);for(s in f)n(p[s])&&za(c,s,"");for(s in p)(a=p[s])!==f[s]&&za(c,s,null==a?"":a)}}function Wn(t,e){if(e&&(e=e.trim()))if(t.classList)e.indexOf(" ")>-1?e.split(/\s+/).forEach(function(e){return t.classList.add(e)}):t.classList.add(e);else{var n=" "+(t.getAttribute("class")||"")+" ";n.indexOf(" "+e+" ")<0&&t.setAttribute("class",(n+e).trim())}}function Gn(t,e){if(e&&(e=e.trim()))if(t.classList)e.indexOf(" ")>-1?e.split(/\s+/).forEach(function(e){return t.classList.remove(e)}):t.classList.remove(e),t.classList.length||t.removeAttribute("class");else{for(var n=" "+(t.getAttribute("class")||"")+" ",r=" "+e+" ";n.indexOf(r)>=0;)n=n.replace(r," ");n=n.trim(),n?t.setAttribute("class",n):t.removeAttribute("class")}}function Zn(t){if(t){if("object"==typeof t){var e={};return!1!==t.css&&_(e,Ja(t.name||"v")),_(e,t),e}return"string"==typeof t?Ja(t):void 0}}function Xn(t){es(function(){es(t)})}function Yn(t,e){var n=t._transitionClasses||(t._transitionClasses=[]);n.indexOf(e)<0&&(n.push(e),Wn(t,e))}function Qn(t,e){t._transitionClasses&&v(t._transitionClasses,e),Gn(t,e)}function tr(t,e,n){var r=er(t,e),i=r.type,o=r.timeout,a=r.propCount;if(!i)return n();var s=i===Ga?Ya:ts,c=0,l=function(){t.removeEventListener(s,u),n()},u=function(e){e.target===t&&++c>=a&&l()};setTimeout(function(){c0&&(n=Ga,u=a,f=o.length):e===Za?l>0&&(n=Za,u=l,f=c.length):(u=Math.max(a,l),n=u>0?a>l?Ga:Za:null,f=n?n===Ga?o.length:c.length:0),{type:n,timeout:u,propCount:f,hasTransform:n===Ga&&ns.test(r[Xa+"Property"])}}function nr(t,e){for(;t.length1}function cr(t,e){!0!==e.data.show&&ir(e)}function lr(t,e,n){var r=e.value,i=t.multiple;if(!i||Array.isArray(r)){for(var o,a,s=0,c=t.options.length;s-1,a.selected!==o&&(a.selected=o);else if(w(fr(a),r))return void(t.selectedIndex!==s&&(t.selectedIndex=s));i||(t.selectedIndex=-1)}}function ur(t,e){for(var n=0,r=e.length;na&&o.push(JSON.stringify(t.slice(a,i)));var s=pn(r[1].trim());o.push("_s("+s+")"),a=i+r[0].length}return a=0&&a[i].lowerCasedTag!==s;i--);else i=0;if(i>=0){for(var c=a.length-1;c>=i;c--)e.end&&e.end(a[c].tag,n,r);a.length=i,o=i&&a[i-1].tag}else"br"===s?e.start&&e.start(t,[],!0,n,r):"p"===s&&(e.start&&e.start(t,[],!1,n,r),e.end&&e.end(t,n,r))}for(var i,o,a=[],s=e.expectHTML,c=e.isUnaryTag||Ji,l=e.canBeLeftOpenTag||Ji,u=0;t;){if(i=t,o&&Qs(o)){var f=0,d=o.toLowerCase(),p=tc[d]||(tc[d]=new RegExp("([\\s\\S]*?)(]*>)","i")),v=t.replace(p,function(t,n,r){return f=r.length,Qs(d)||"noscript"===d||(n=n.replace(//g,"$1").replace(//g,"$1")),oc(d,n)&&(n=n.slice(1)),e.chars&&e.chars(n),""});u+=t.length-v.length,t=v,r(d,u-f,u)}else{oc(o,t)&&n(1);var h=t.indexOf("<");if(0===h){if(Fs.test(t)){var m=t.indexOf("--\x3e");if(m>=0){e.shouldKeepComment&&e.comment(t.substring(4,m)),n(m+3);continue}}if(Hs.test(t)){var g=t.indexOf("]>");if(g>=0){n(g+2);continue}}var y=t.match(Us);if(y){n(y[0].length);continue}var _=t.match(Rs);if(_){var b=u;n(_[0].length),r(_[1],b,u);continue}var x=function(){var e=t.match(Ms);if(e){var r={tagName:e[1],attrs:[],start:u};n(e[0].length);for(var i,o;!(i=t.match(Ps))&&(o=t.match(Ns));)n(o[0].length),r.attrs.push(o);if(i)return r.unarySlash=i[1],n(i[0].length),r.end=u,r}}();if(x){!function(t){var n=t.tagName,i=t.unarySlash;s&&("p"===o&&Os(n)&&r(o),l(n)&&o===n&&r(n));for(var u=c(n)||!!i,f=t.attrs.length,d=new Array(f),p=0;p=0){for($=t.slice(h);!(Rs.test($)||Ms.test($)||Fs.test($)||Hs.test($)||(C=$.indexOf("<",1))<0);)h+=C,$=t.slice(h);w=t.substring(0,h),n(h)}h<0&&(w=t,t=""),e.chars&&w&&e.chars(w)}if(t===i){e.chars&&e.chars(t);break}}r()}function Dr(t,e){function n(t){t.pre&&(s=!1),Ws(t.tag)&&(c=!1)}zs=e.warn||hn,Ws=e.isPreTag||Ji,Gs=e.mustUseProp||Ji,Zs=e.getTagNamespace||Ji,qs=mn(e.modules,"transformNode"),Ks=mn(e.modules,"preTransformNode"),Js=mn(e.modules,"postTransformNode"),Vs=e.delimiters;var r,i,o=[],a=!1!==e.preserveWhitespace,s=!1,c=!1;return Nr(t,{warn:zs,expectHTML:e.expectHTML,isUnaryTag:e.isUnaryTag,canBeLeftOpenTag:e.canBeLeftOpenTag,shouldDecodeNewlines:e.shouldDecodeNewlines,shouldKeepComment:e.comments,start:function(t,a,l){var u=i&&i.ns||Zs(t);oo&&"svg"===u&&(a=Qr(a));var f={type:1,tag:t,attrsList:a,attrsMap:Zr(a),parent:i,children:[]};u&&(f.ns=u),Yr(f)&&!go()&&(f.forbidden=!0);for(var d=0;d0,so=io&&io.indexOf("edge/")>0,co=io&&io.indexOf("android")>0,lo=io&&/iphone|ipad|ipod|ios/.test(io),uo=io&&/chrome\/\d+/.test(io)&&!so,fo={}.watch,po=!1;if(ro)try{var vo={};Object.defineProperty(vo,"passive",{get:function(){po=!0}}),window.addEventListener("test-passive",null,vo)}catch(t){}var ho,mo,go=function(){return void 0===ho&&(ho=!ro&&void 0!==t&&"server"===t.process.env.VUE_ENV),ho},yo=ro&&window.__VUE_DEVTOOLS_GLOBAL_HOOK__,_o="undefined"!=typeof Symbol&&T(Symbol)&&"undefined"!=typeof Reflect&&T(Reflect.ownKeys),bo=function(){function t(){r=!1;var t=n.slice(0);n.length=0;for(var e=0;e1?y(n):n;for(var r=y(arguments,1),i=0,o=n.length;i1&&(e[n[0].trim()]=n[1].trim())}}),e}),Ha=/^--/,Ba=/\s*!important$/,za=function(t,e,n){if(Ha.test(e))t.style.setProperty(e,n);else if(Ba.test(n))t.style.setProperty(e,n.replace(Ba,""),"important");else{var r=qa(e);if(Array.isArray(n))for(var i=0,o=n.length;iv?(f=n(i[g+1])?null:i[g+1].elm,y(t,f,i,p,g,o)):p>g&&b(t,e,d,v)}function $(t,e,o,a){if(t!==e){var s=e.elm=t.elm;if(i(t.isAsyncPlaceholder))return void(r(e.asyncFactory.resolved)?k(t.elm,e,o):e.isAsyncPlaceholder=!0);if(i(e.isStatic)&&i(t.isStatic)&&e.key===t.key&&(i(e.isCloned)||i(e.isOnce)))return void(e.componentInstance=t.componentInstance);var c,l=e.data;r(l)&&r(c=l.hook)&&r(c=c.prepatch)&&c(t,e);var u=t.children,f=e.children;if(r(l)&&h(e)){for(c=0;c',n.innerHTML.indexOf(e)>0}("\n","
"),ys=/\{\{((?:.|\n)+?)\}\}/g,_s=/[-.*+?^${}()|[\]\/\\]/g,bs=m(function(t){var e=t[0].replace(_s,"\\$&"),n=t[1].replace(_s,"\\$&");return new RegExp(e+"((?:.|\\n)+?)"+n,"g")}),xs={staticKeys:["staticClass"],transformNode:Ar,genData:Or},ws={staticKeys:["staticStyle"],transformNode:Sr,genData:Tr},$s=[xs,ws],Cs={model:En,text:Lr,html:Er},ks=p("area,base,br,col,embed,frame,hr,img,input,isindex,keygen,link,meta,param,source,track,wbr"),As=p("colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr,source"),Os=p("address,article,aside,base,blockquote,body,caption,col,colgroup,dd,details,dialog,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,legend,li,menuitem,meta,optgroup,option,param,rp,rt,source,style,summary,tbody,td,tfoot,th,thead,title,tr,track"),Ss={expectHTML:!0,modules:$s,directives:Cs,isPreTag:$a,isUnaryTag:ks,mustUseProp:pa,canBeLeftOpenTag:As,isReservedTag:Ca,getTagNamespace:Ue,staticKeys:function(t){return t.reduce(function(t,e){return t.concat(e.staticKeys||[])},[]).join(",")}($s)},Ts={decode:function(t){return ms=ms||document.createElement("div"),ms.innerHTML=t,ms.textContent}},Ls=/([^\s"'<>\/=]+)/,Es=/(?:=)/,js=[/"([^"]*)"+/.source,/'([^']*)'+/.source,/([^\s"'=<>`]+)/.source],Ns=new RegExp("^\\s*"+Ls.source+"(?:\\s*("+Es.source+")\\s*(?:"+js.join("|")+"))?"),Ds="[a-zA-Z_][\\w\\-\\.]*",Is="((?:"+Ds+"\\:)?"+Ds+")",Ms=new RegExp("^<"+Is),Ps=/^\s*(\/?)>/,Rs=new RegExp("^<\\/"+Is+"[^>]*>"),Us=/^]+>/i,Fs=/^
174 |
175 |
176 | 未查找到聊天记录
177 |
178 |
193 |
194 | -
195 |
196 |
197 |
198 |
![]()
199 |
200 |
201 |
202 |
203 |
204 |
![聊天图片]()
205 |
206 |
207 |
208 |
209 |
210 |
211 |
213 |
214 |
215 |
`
30 | }
31 | return imgHTML;
32 | });
33 | return text;
34 | }
35 |
36 |
37 | Vue.directive('emotion', {
38 | bind: function (el, binding) {
39 | el.innerHTML = toEmotion(binding.value)
40 | }
41 | });
42 |
43 |
44 | new Vue({
45 | el: '#app',
46 | render: h => h(App)
47 | })
48 |
--------------------------------------------------------------------------------
/webpack.config.js:
--------------------------------------------------------------------------------
1 | var path = require('path')
2 | var webpack = require('webpack')
3 |
4 | module.exports = {
5 | entry: './src/main.js',
6 | output: {
7 | path: path.resolve(__dirname, './dist'),
8 | publicPath: '/dist/',
9 | filename: 'build.js'
10 | },
11 | module: {
12 | rules: [
13 | {
14 | test: /\.vue$/,
15 | loader: 'vue-loader',
16 | options: {
17 | loaders: {
18 | }
19 | // other vue-loader options go here
20 | }
21 | },
22 | {
23 | test: /\.js$/,
24 | loader: 'babel-loader',
25 | exclude: /node_modules/
26 | },
27 | {
28 | test: /\.(png|jpg|gif|svg)$/,
29 | loader: 'file-loader',
30 | options: {
31 | name: '[name].[ext]?[hash]'
32 | }
33 | }
34 | ]
35 | },
36 | resolve: {
37 | alias: {
38 | 'vue$': 'vue/dist/vue.esm.js'
39 | }
40 | },
41 | devServer: {
42 | historyApiFallback: true,
43 | noInfo: true
44 | },
45 | performance: {
46 | hints: false
47 | },
48 | devtool: '#eval-source-map'
49 | }
50 |
51 | if (process.env.NODE_ENV === 'production') {
52 | module.exports.devtool = '#source-map'
53 | // http://vue-loader.vuejs.org/en/workflow/production.html
54 | module.exports.plugins = (module.exports.plugins || []).concat([
55 | new webpack.DefinePlugin({
56 | 'process.env': {
57 | NODE_ENV: '"production"'
58 | }
59 | }),
60 | new webpack.optimize.UglifyJsPlugin({
61 | sourceMap: true,
62 | compress: {
63 | warnings: false
64 | }
65 | }),
66 | new webpack.LoaderOptionsPlugin({
67 | minimize: true
68 | })
69 | ])
70 | }
71 |
--------------------------------------------------------------------------------