index.jsx 2.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import Taro from "@tarojs/taro"
  2. import { View,Image,Text } from "@tarojs/components"
  3. import { useState } from "react"
  4. import './style.less'
  5. export default (props) => {
  6. const { ico, textNext, onSelected, nextQuestio } = props
  7. const YES = 'https://yz-shigongli.oss-cn-shanghai.aliyuncs.com/images/RandomIIcon/YES.png'
  8. const No = 'https://yz-shigongli.oss-cn-shanghai.aliyuncs.com/images/RandomIIcon/No.png'
  9. const [imageOne, setImageOne] = useState(false)
  10. const [imageTow, setImageTow] = useState(false)
  11. const handleYES = () => {
  12. setImageOne(true)
  13. setImageTow(false)
  14. onSelected()
  15. setTimeout(() => {
  16. nextQuestio()
  17. }, 500);
  18. }
  19. const handleNo = () => {
  20. setImageOne(false)
  21. setImageTow(true)
  22. onSelected()//未选择不给到下一题
  23. setTimeout(() => {
  24. nextQuestio()
  25. }, 500);
  26. }
  27. return (
  28. <View >
  29. <View style='font-size: 20px;font-weight: bold;color: #140F0F;marginLeft:10px;;'>
  30. 2<Text style='font-size: 13px;font-weight: bold;color: #140F0F;'> / 5 </Text>你是单身吗?
  31. </View>
  32. <View className='Girl-Conste-box' onClick={handleYES} >
  33. <View className='Girl-box-imageContent'>
  34. <Image className={`Girl-box-image imageTwo ${imageOne && 'Girl-imageLess'} `} src={YES} />
  35. </View>
  36. <View className='Girl-box-content' >
  37. <View className='Girl-box-C-title' >
  38. YES
  39. </View>
  40. <View className='Girl-box-C-moon' >
  41. </View>
  42. </View>
  43. </View>
  44. <View className='Girl-Conste-box' onClick={handleNo} >
  45. <View className='Girl-box-imageContent'>
  46. <Image className={`Girl-box-image ${imageTow && 'Girl-imageLess'} `} src={No} />
  47. </View>
  48. <View className='Girl-box-content' >
  49. <View className='Girl-box-C-title' >
  50. No
  51. </View>
  52. <View className='Girl-box-C-moon' >
  53. </View>
  54. </View>
  55. </View>
  56. </View>
  57. )
  58. }