Taro
跨端小程序开发
一下子就醒了
何以渡清欢
展开
-
改造微信小程序Swiper组件,自定义切换动画
改造Swiper组件,符合业务的设计和动画效果。原创 2024-04-11 17:42:03 · 508 阅读 · 0 评论 -
覆盖微信原生组件Switch的样式
【代码】覆盖微信原生组件Switch的样式。原创 2024-04-11 17:33:26 · 426 阅读 · 0 评论 -
基于Taro + React 实现微信小程序半圆滑块组件、半圆进度条、弧形进度条、半圆滑行轨道(附源码)
给大家提供一些实现思路,找了一圈,一些文章基本不能直接用,错漏百出,代码还藏着掖着,希望可以帮到大家。3、可以点击区域切换档位。2、可点击加减切换档位。4、可以滑动切换档位。原创 2023-11-01 11:36:36 · 2383 阅读 · 2 评论 -
小程序Input表单输入限制最大值、最小值、只能输入数字、小数点位数
import React, { useState, useCallback, FC, useEffect } from 'react'import { t } from 'gm-i18n'import { Flex, View, Dialog, Input, Toast } from '@xx-mobile/mp'import { observer } from 'mobx-react'import _ from 'lodash'import store from '../store'...原创 2021-08-27 14:42:41 · 5291 阅读 · 0 评论 -
Taro项目 实现一个在页面内自由拖拽的滑块,仿苹果手机的辅助按钮
效果:原创 2021-06-08 19:14:15 · 1207 阅读 · 0 评论 -
taro 项目中接入EChart图表库
1、使用物料市场提供的封装好的组件https://taro-ext.jd.com/plugin/view/5f648e4c0dd8313026e0942dnpm i echarts-taro3-react or yarn add echarts-taro3-react2、使用、封装折线图组件:lineChart.jsimport React, { Component } from 'react'import { View } from '@tarojs/components'原创 2021-04-01 16:12:56 · 1728 阅读 · 2 评论 -
Taro框架---仿微信左滑动删除
1、index.jsimport React, { Component } from 'react'import { ScrollView , View} from '@tarojs/components'import Taro from '@tarojs/taro'import './index.less'export default class Index extends Component { state = { animation: '', startX: 0,原创 2021-04-01 14:40:45 · 1378 阅读 · 0 评论 -
在taro项目中使用antv/f2图表库
1、安装@antv/f2npm install @antv/f2 --save2、封装Canvas组件F2Canvas.jsimport React from 'react'import Taro from '@tarojs/taro'import { Canvas } from '@tarojs/components'/**|--------------------------------------------------| @Drawer| #Component|原创 2021-03-29 17:50:13 · 3135 阅读 · 4 评论 -
Taro项目使用websocket实现一个在线聊天室
Taro提供了一些websocket相关的接口https://taro-docs.jd.com/taro/docs/apis/network/webSocket/connectSocket1、聊天室的效果二、实现思路1、Taro.connectSocket创建连接2、onMessage监听服务器返回的数据3、创建一个全局存储消息的数组 let arr = []4、Input输入框获取到的值,在点击发送的时候,放进arr数组,arr.push({nickname:...原创 2020-07-20 17:47:53 · 3247 阅读 · 1 评论 -
Taro 项目实现更改微信头像,使用七牛上传图片
一、效果图二、taro 提供了选择图片的接口https://taro-docs.jd.com/taro/docs/apis/media/image/chooseImage// 文档提供的示例Taro.chooseImage({ count: 1, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册.原创 2020-06-10 17:03:31 · 2103 阅读 · 0 评论 -
Taro项目实现手机号绑定,发送验证码倒计时
UpdatePhone.jsximport Taro, { Component, PureComponent } from '@tarojs/taro'import { View, Button, Text, Picker } from '@tarojs/components'import { connect } from '@tarojs/redux'import { AtForm, AtInput, AtButton, AtToast } from "taro-ui"import Ar原创 2020-06-02 11:26:53 · 1855 阅读 · 0 评论 -
在Taro项目中Ping++ 接入微信小程序支付
相关ping++支付文档:https://help.pingxx.com/article/1011655/源码的地址:https://github.com/PingPlusPlus/pingpp-js一、在项目中引入ping++的sdk可以使用npm 的安装方式npm install pingpp-js在页面的顶部引入let pingpp = require('pingpp-js');二、使用1、需要获取到code2、提交订单数据,成功生成预支付订单后,返回.原创 2020-06-02 10:46:09 · 1013 阅读 · 0 评论 -
小程序待支付倒计时的实现
1、遵循框架taro语法 componentDidMount() { this.fetchInitData(); }fetchInitData = () => { let { id } = this.$router.params; console.warn('detail get id ', id) if (id) { this.props.dispatch({ type: 'order/personOr原创 2020-05-25 14:11:44 · 936 阅读 · 0 评论 -
使用Taro 实现的小程序商城的购物车功能模块
Taro是一套遵循React语法规范的多端开发解决方案。现如今市面上端的形态多种多样,Web、React-Native、微信小程序等各种端大行其道,当业务要求同时在不同的端都要求有所表现的时候,针对不同的端去编写多套代码的成本显然非常高,这时候只编写一套代码就能够适配到多端的能力就显得极为需要。使用Taro,我们可以只书写一套代码,再通过Taro的编译工具,将源代码分别编译...原创 2020-04-17 20:30:52 · 1491 阅读 · 0 评论 -
基于Taro框架实现的小程序分享图片功能
Taro是一套遵循React语法规范的多端开发解决方案。现如今市面上端的形态多种多样,Web、React-Native、微信小程序等各种端大行其道,当业务要求同时在不同的端都要求有所表现的时候,针对不同的端去编写多套代码的成本显然非常高,这时候只编写一套代码就能够适配到多端的能力就显得极为需要。使用Taro,我们可以只书写一套代码,再通过Taro的编译工具,将源代码分别编译...原创 2020-04-17 20:03:28 · 1569 阅读 · 0 评论