人人都能做点小生意之微信小商店

331 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第7天,点击查看活动详情

原公司是集团公司,有很多子公司,有一天子公司的同事联系我说能不能开发个微信小程序商城方便在公众号和视频号上卖产品。开始觉得是大工程,继续沟通后发现没有具体的要求,只是有大概的想法,商品展示/下单/结算/快递/后台管理这些还都要有。根据经验,这种情况直接找现成的小程序产品即可,刚好在小程序文档看到有一个标准版交易组件,小程序引入该组件后就能完成一个小程序商城的开发(官方称为小商店),并且还提供了后台管理模块。

开发

前置准备内容

  • 申请小程序
  • 在小程序后台开通交易组件
  • 标准版交易组件的后台(微信小商店)填写相关资料及上传相关证件提交审核,完成开店任务

正式开发只需要创建一个新的小程序项目并改动以下四个文件内容

1656398108241.jpg

app.json

  • 导航栏改为自定义custom
  • 添加plugins,直接复制,不修改改动
{
  "pages":[
    "pages/index/index"
  ],
  "window":{
    "navigationStyle": "custom"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json",
  "plugins": {
    "mini-shop-plugin": {
      "version": "latest",
      "provider": "wx34345ae5855f892d"
    }
  }
}

app.js 进行组件初始化

const miniShopPlugin = requirePlugin('mini-shop-plugin');
App({
  onLaunch: function () {
    miniShopPlugin.initApp(this, wx);
  }
})

index.json 配置页面要用到的自定义组件,xxx/pages/home/home为小商店首页布局

{
  "usingComponents": {
    "home": "plugin-private://wx34345ae5855f892d/pages/home/home"
  }
}

index.wxml 页面使用组件

<home ></home>
效果
1656397676728.jpg1656397705417.jpg1656397740370_LI.jpg

上述改动完成后,即可发布上线,一个微信小商店小程序就开发完成了,在小商店后台添加商品后小程序也会同步更新

意外发现

整理此篇文章时才发现,可以0开发,一键生成微信小商店。上述开发适用情况为【已有小程序,需接入交易能力】的时候使用。如果只是需要一个小商店(商城),那么在【小商店助手】申请开店

1656412781976.jpg

填写提交开店信息后,在首页 头像下可以进入对应的店铺小程序,这个小程序和引入组件开发是一样的界面和功能

1656412957403.jpg

官方文档:微信小商店简介 | 微信开放文档 (qq.com)

最后

开店资质可以为个人、个体、企业。个人利用自己的技能开发的项目也是可以上架售卖的,项目多的话,也是一个副业选择