taro 横向滚动

import Taro, { Component } from '@tarojs/taro';
import { View,ScrollViewProps } from '@tarojs/components';
import { connect } from '@tarojs/redux';
import './index.scss';
import EmptyBlock from '@/components/EmptyBlock';

@connect(({feedback}) => ({
...feedback,
}))
class Feedback extends Component {
config = {
navigationBarTitleText: '意见反馈',
};

componentDidShow = () => {
this.props.dispatch({ type:'feedback/save',payload:{ask_list :[]}})
this.props.dispatch({
type: 'feedback/init',
});
};
toAdd = ()=>{
Taro.navigateTo({
url:'/pages/feedback/add/index'
})
}
render() {

const scrollStyle = {
  height: '150px',
  '1500px',
  'white-space': 'nowrap'
}
const scrollTop = 0
const Threshold = 20
const vStyleA = {
  display: 'inline-block',
  height: '150px',
  '500px',
  background: 'rgb(26, 173, 25)'
}
const vStyleB = {
  display: 'inline-block',
         height: '150px',
    '500px',
  background: 'rgb(39,130,215)'
}
const vStyleC = {
  display: 'inline-block',
  height: '150px',
  '500px',
  background: 'rgb(241,241,241)',
  color: '#333'
}
return (
  <ScrollView
    className='scrollview'
    scrollX
    scrollWithAnimation
    scrollTop={scrollTop}
    style={scrollStyle}
    lowerThreshold={Threshold}
    upperThreshold={Threshold}
    onScrollToUpper={this.onScrollToUpper.bind(this)} // 使用箭头函数的时候 可以这样写 `onScrollToUpper={this.onScrollToUpper}`
    onScroll={this.onScroll}
  >
    <View style={vStyleA}>A</View>
    <View style={vStyleB}>B</View>
    <View style={vStyleC}>C</View>
  </ScrollView>
)

}
}

原文地址:https://www.cnblogs.com/pansidong/p/13666635.html