首页 > 其他分享 >Taro+vue3 关注抖音号

Taro+vue3 关注抖音号

时间:2023-09-12 10:35:51浏览次数:45  
标签:Taro aweme 抖音 vue3 id 页面

 

Taro使用vue3或者react框架,data-aweme-id属性是不被解析到生成的页面代码中的,所以需要借助编译插件@tarojs/plugin-inject去注入标签属性;

https://taro-docs.jd.com/docs/vue-overall#dataset

业务页面:

<button open-type="openAwemeUserProfile" :dataAwemeId="awemeId">关注抖音号</button>

config/index.js

const config = {
  // 其他配置
  ...,
  plugins: [
    [
      '@tarojs/plugin-inject',
      {
        components: {
          Button: {
            'data-aweme-id': "''", // 按钮注入特殊属性,这里放一个空字符串的时候,页面才能通过变量赋值;如果指定一个值,则生成一个固定的值;
            'group-id': "",
          },
        },
      },
    ],
  ],
  // 其他配置
  ...,
}

  

标签:Taro,aweme,抖音,vue3,id,页面
From: https://www.cnblogs.com/guxingzhe/p/17695357.html

相关文章

  • Vue3入门学习---指令篇
    前言Vue3是一款非常流行的JavaScript框架,它提供了很多的指令来方便我们进行开发。在本篇博客中,我们将详细介绍Vue3的指令,让大家更好地了解这款框架的强大之处。正文开始1.v-bind指令v-bind指令用于绑定数据到DOM元素上,可以绑定任何JavaScript表达式。在Vue3中,我们可以使用简写......
  • 电商带货的销量商城导流-抖音小程序源码
      在当今的互联网平台上,电商平台的模式也是为了迎合大众群体的需求,他们建立一个完善的电商购物平台。抖音电商平台的由于客户量大,开发一款抖音商城的电商小程序,就等于圈住了一部分的流量,在抖音平台上展示商品的机会就多了,通过抖音小程序能实现全新模式的购物环境。  开发......
  • 创建vue3的项目和目录结构讲解
    本节目标了解Vue3项目的结构学习Vue3项目的基本开发知识Vue3和Vue2的开发区别全局安装vue-clinpmi-g@vue/clivuecreatevue3-json-schema-form自定义vue3配置自定义配置:选择[自定义],通过方向键上下移动,空格选中,Enter确定,自定义配置中,您将会看到这些配置......
  • vue3下载文件
    constdow=async(url:string,fileName:string)=>{mulSelUrls.value=[]mulSelUrls.value.push(urlasnever)constrequests=mulSelUrls.value.map(url=>axios.get(url,{responseType:'blob'}));try{constresponses=aw......
  • 鉴于vue2使用element组件不太方便,换成vue3的具体步骤
    1、卸载原有的vue2npmuninstallvue-cli-g卸载完成!2、按照最新的下载vue3命令下载vue3npminstall-g@vue-cli下载完成!(等了大概快10分钟)......
  • vue3探索——5分钟快速上手大菠萝pinia
    温馨提示:本文以vue3+vite+ts举例,vite配置和ts语法侧重较少,比较适合有vuex或者vue基础的小伙伴们儿查阅。安装piniayarnyarnaddpinianpmnpminstallpiniapnpmpnpmaddpinia1-开始方式一:在main.ts中直接引入pinia在src/main.ts中引入pinia(根存储),并传递给......
  • vue3 如何获取格式为 proxy 值的原始值
    vue3中变量多使用ref,reactive来声明。如下:constfirstName=ref('Tom')constlastName=ref('Jerry')constform=reactive({name:'',sex:'',age:'',area:'',loves:[]})当想使用上面的数据时,如下://......
  • 生成一个vue3的博客
    Vue3是一个流行的JavaScript框架,用于构建用户界面。要生成一个Vue3的博客,您需要按照以下步骤进行操作:首先,确保您的环境中已经安装了Node.js和npm(Node包管理器)。您可以通过在命令行中运行node-v和npm-v来检查它们的版本。在您喜欢的目录中创建一个新的Vue3项目......
  • vue3 跳转小程序
    兼容微信内跳转和h5跳转第一步在index.html里面引入SKD<!--公众号JSSDK--><scriptsrc="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script><!--云开发WebSDK--><scriptsrc="https://res.wx.qq.com/open/js/cloudbase/1.1.0/clo......
  • vue3+PHP实战手册(16)
    目录通讯录管理系统登录通讯录管理系统登录使用v-model进行双向绑定,将表单输入框的内容同步给JavaScript中相应的变量,设置了相应的事件监听器。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>通讯录管理系统</title></head>......