Meituan /Ele.meテイクアウトアプレットのソースコード
Alimama / Meituan Allianceに登録するだけで、簡単にプロモーション手数料を受け取ることができます。
Taoke、JD Alliance、Duoduokeなどのショッピングガイドアプリはますます増えており、多くの人がMeituanとEle.meの小さなプログラムのソースコードを探して赤いパケットを配信しています！みんなと共有する
Meituan /Ele.meテイクアウトCPSアライアンスリベート公式アカウントミニプログラム核分裂コアソースコード
ソースコードアドレス
https://gitee.com/caonima008/coupon/
ステップ
- 上記のソースコードをローカルhttps://gitee.com/caonima008/coupon/にダウンロードし
ます - 独自のWeChatアプレットに変更し、/ dist / pages / ele /index.jsを開きます
- WeChatミニプログラム->開発管理->リクエストのドメイン名を追加するための開発設定：アドレス：https：
//mp.weixin.qq.com/wxamp/devprofile/get_profile？token = 271531762＆lang = zh_CN
- ミニプログラム管理のバックグラウンドでリンクを構成する
舞台裏のアドレス：http：//q.mybei.cn - 入力後、[ミニプログラム管理]-> [非核分裂ミニプログラム管理]-> [ミニプログラムの追加]-> [独自のリンクに入力]を選択します
- WeChat開発者ツール、プロジェクトのインポート、レビューのための送信
完成品展示
コード
<template>
<!--动态样式-->
<view class="container" wx:style="{
{
dynamicStyle}}">
<!--数据绑定-->
<view class="title">{
{
title}}</view>
<!--计算属性数据绑定-->
<view class="title">{
{
reversedTitle}}</view>
<view class="list">
<!--循环渲染，动态类名，事件处理内联传参-->
<view wx:for="{
{
list}}" wx:key="id" class="list-item" wx:class="{
{
{
active:item.active} }}"
bindtap="handleTap(index)">
<view>{
{
item.content}}</view>
<!--循环内部双向数据绑定-->
<input type="text" wx:model="{
{
list[index].content}}"/>
</view>
</view>
<!--自定义组件获取实例，双向绑定，自定义双向绑定属性及事件-->
<custom-input wx:ref="ci" wx:model="{
{
customInfo}}" wx:model-prop="info" wx:model-event="change"/>
<!--动态组件，is传入组件名字符串，可使用的组件需要在json中注册，全局注册也生效-->
<component is="{
{
current}}"></component>
<!--显示/隐藏dom-->
<view class="bottom" wx:show="{
{
showBottom}}">
<!--模板条件编译，__mpx_mode__为框架注入的环境变量，条件判断为false的模板不会生成到dist-->
<view wx:if="{
{
__mpx_mode__ === 'wx'}}">wx env</view>
<view wx:if="{
{
__mpx_mode__ === 'ali'}}">ali env</view>
</view>
</view>
</template>
<script>
import {
createPage } from '@mpxjs/core'
createPage({
data: {
// 动态样式和类名也可以使用computed返回
dynamicStyle: {
fontSize: '16px',
color: 'red'
},
title: 'hello world',
list: [
{
content: '全军出击',
id: 0,
active: false
},
{
content: '猥琐发育，别浪',
id: 1,
active: false
}
],
customInfo: {
title: 'test',
content: 'test content'
},
current: 'com-a',
showBottom: false
},
computed: {
reversedTitle () {
return this.title.split('').reverse().join('')
}
},
watch: {
title: {
handler (val, oldVal) {
console.log(val, oldVal)
},
immediate: true
}
},
handleTap (index) {
// 处理函数直接通过参数获取当前点击的index，清晰简洁
this.list[index].active = !this.list[index].active
},
onReady () {
setTimeout(() => {
// 更新数据，同时关联的计算属性reversedTitle也会更新
this.title = '你好，世界'
// 此时动态组件会从com-a切换为com-b
this.current = 'com-b'
}, 1000)
}
})
</script>
<script type="application/json">
{
"usingComponents": {
"custom-input": "../components/custom-input",
"com-a": "../components/com-a",
"com-b": "../components/com-b"
}
}
</script>
<style lang="stylus">
.container
position absolute
width 100%
</style>