<template>
<div class='page'>
    <div class='page__bd'>
		<div class='weui-form'>
		    <div class='weui-form__text-area'>
		      <h2 class='weui-form__title'>APP卡片分享助手</h2>
		      <div class='weui-form__desc'>这是一个简单的APP卡片分享小工具,可以让你在微信、朋友圈、QQ、微博。进行卡片式分享。</div>
		    </div>
		<div class='weui-form__control-area'>
		<div class='weui-cells__group weui-cells__group_form'>
		<div class='weui-cells__title'>填写你的网站信息</div>
		<div class='weui-cells'>
		          <label for='js_input1' class='weui-cell weui-cell_active'>
		            <div class='weui-cell__hd'><span class='weui-label'>网站url</span></div>
		            <div class='weui-cell__bd'>
		                <input id='js_input1' class='weui-input' placeholder='请输入你的网站url' v-model='shareUrl'/>
		            </div>
		          </label>
		          <label for='js_input2' class='weui-cell weui-cell_active'>
		            <div class='weui-cell__hd'><span class='weui-label'>网站标题</span></div>
		            <div class='weui-cell__bd'>
		                <input id='js_input2' class='weui-input' placeholder='请输入你的网站标题' v-model='shareTitle'/>
		            </div>
		          </label>
		          <label for='js_input3' class='weui-cell weui-cell_active'>
		            <div class='weui-cell__hd'><span class='weui-label'>网站描述</span></div>
		            <div class='weui-cell__bd'>
		                <input id='js_input3' class='weui-input' placeholder='请填写你的网站描述' v-model='shareContent'/>
		            </div>
		          </label>
				  <label for='js_input3' class='weui-cell weui-cell_active'>
				    <div class='weui-cell__hd'><span class='weui-label'>网站略缩图</span></div>
				    <div class='weui-cell__bd'>
				        <input id='js_input3' class='weui-input' placeholder='请填写你的网站网站略缩图' v-model='shareImg'/>
				    </div>
				  </label>
		        </div>
		</div>
		</div>
		</div>
        <a @click='onShare()' role='button' class='weui-btn weui-btn_default' id='showIOSActionSheet'>分享</a>
        </div>
	</div>
</div>
</template>
<script>
	import appShare, { closeShare } from '@/utils/share.js'
	export default {
		data() {
			return {
				shareUrl: 'https://www.fiii.cn',
				shareTitle: '小趴菜博客',
				shareContent: '小趴菜博客',
				shareImg: 'https://www.fiii.cn/logo.png'
			}
		},
		onLoad() {
			
		},
		methods: {
			onShare(){
				let shareData = {
					shareUrl: this.shareUrl,
					shareTitle: this.shareTitle,
					shareContent: this.shareContent,
					shareImg: this.shareImg
				};
				let shareObj = appShare(shareData,res => {
					console.log('分享成功回调',res);
					// 分享成功后关闭弹窗
					// 第一种关闭弹窗的方式
					closeShare();
				});
				setTimeout(() => {
					// 第二种关闭弹窗的方式
					shareObj.close();
				},5000); 
			},
			onShareType(type){
				let shareData = {
					shareUrl: this.shareUrl,
					shareTitle: this.shareTitle,
					shareContent: this.shareContent,
					shareImg: this.shareImg
				}
				
				appShare(shareData,res => {
					console.log('分享成功回调',res);
				});
			}
		}
	}
</script>
<style>

</style>

原文地址: https://www.cveoy.top/t/topic/n7NQ 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录