Vue

在Vue Spa项目中，使用了 History 模式，要使用分享接口，只能在第一次访问的时候，就加载jssdk配置，通过Vue router进入其他页面之后再做加载，虽然在调试模式下依然会显示配置正确，但是分享接口是无效的，那么怎么办呢？直接在App.vue下就做jssdk config 实现步骤 编写后端接口 使用了 overture/wechat public function jssdk(Request $request) { $this->jssdk->setUrl($request->input('url')); return $this->jssdk->buildConfig([ 'onMenuShareAppMessage', 'onMenuShareWechat', 'onMenuShareTimeline', 'getLocation' ], false); } 在App.vue中注入配置 引入wexin-js-sdk const wx = require('weixin-js-sdk') 方法 async getJssdk () { const { data } = await this.$axios.post('/api/wechat-work/jssdk', { url: window.location.href }) wx.config(data) } 在分享页面中编写分享方法 引入wexin-js-sdk const wx = require('weixin-js-sdk') 在__mounted__里写入分享方法 wx.ready(() => { const self = this wx.onMenuShareTimeline({ title: self.shareTitle, link: window.location.href, imgUrl: self.logoPath, success: function () { self....

Sortable.js 是拖拽列表最著名的库，而 Vue.Draggable 是其在 Vue 中的封装，在 vue 中引入十分的方便。 但是我在项目中的需求是左侧列表初始时是空的，从右侧列表拖动到左侧生成，这就造成了一个问题，左侧因为没有dom节点而拖不过来，这时就需要在左侧的 draggable 组件添加一个 min-height 的 css 属性。 另一个问题是，在使用 clone 模式时，因为 js 对象都是指向同一个指针的，再从右侧拖动到左侧的节点，当修改其属性时，把所有拖拽过来的相同节点也都修改了。 我的解决方法是，把右侧改为 pull 模式，同时使用 vue 的 watch，当右侧的列表发生变化时重新生成，这样就和初始化的对象完全脱离了。

在 vue中使用viewerjs 必须执行 viewer.update const viewer = new Viewer(this.$refs.image) this.$nextTick().then(() => { viewer.update() }) viewer.view(0) 当然最后别忘了引入css @import "~viewerjs/dist/viewer.css";