Shulou(Shulou.com)06/02 Report--

In this issue, the editor will bring you how to write sample code about uniapp to achieve WeChat Mini Programs's global sharing. The article is rich in content and analyzes and describes for you from a professional point of view. I hope you can get something after reading this article.

Uniapp realizes WeChat Mini Programs's global forwarding to friends / sharing to moments. It mainly uses the concept of global blending of Vue.js.

The following steps and code are implemented directly:

Create a global shared content file

1. Create a globally shared js file. The sample file path is @ / common/share.js, in which you define the content to be shared globally:

Export default {data () {return {/ / default global sharing content share: {title: 'global sharing title', path:'/ pages/home/home' / / Global sharing path imageUrl:'.. /.. / static/imgs/fenxiang-img.png', / / globally shared images (locally networkable)}, / / define global sharing / / 1. Send it to your friend onShareAppMessage (res) {return {title: this.share.title, path: this.share.path, imageUrl: this.share.imageUrl,}}, / / 2. Share to moments onShareTimeline (res) {return {title: this.share.title, path: this.share.path, imageUrl: this.share.imageUrl,}},} to introduce and register the file globally

two。 Introduce the share.js file into the main.js file of the project and mix it globally using the Vue.mixin () method:

/ / Import and mount the global sharing method import share from'@ / common/share.js'Vue.mixin (share)

Let's take a look at the overall sharing effect:

Custom page sharing content

3. If you need to customize the sharing content on a specific page, you can still use the page's onShareAppMessage () and onShareTimeline () methods to customize the shared content, and the global sharing will be overwritten by the shared content defined on the page. Examples are as follows:

OnLoad () {}, / / customize the forwarding of this page to friends (there is already a global sharing method Global) onShareAppMessage (res) {return {title: 'title of page sharing', path:'/ pages/my/my', imageUrl:'.. /.. / static/imgs/mylogo.png'}} / / Custom page sharing to moments onShareTimeline (res) {return {title: 'page sharing title', path:'/ pages/my/my' ImageUrl:'.. /.. / static/imgs/mylogo.png'}}

Note: the onShareAppMessage () and onShareTimeline () methods are at the same level as onLoad, methods and other methods.

The above is the editor for you to share the uniapp to achieve WeChat Mini Programs global sharing sample code how to write, if you happen to have similar doubts, you might as well refer to the above analysis to understand. If you want to know more about it, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.