Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🐛 [Bug]: 按照文档,中ConfigProvider 的 修改主题颜色的方式,修改Picker 中选中选项的 字体颜色,不生效 #747

Open
2 tasks
tingfeima opened this issue Oct 18, 2024 · 0 comments

Comments

@tingfeima
Copy link

Which React Vant packages are impacted?

  • react-vant (React Vant core)
  • react-vant-icons(React Vant Icon)

What version of React Vant are you using?

3.3.5

Reproduce live demo(codesandebox or stackblitz)?

No response

Descripition

import React, { useState } from 'react'
import isEmpty from 'lodash/isEmpty'
import { ConfigProvider, Picker, Field } from 'react-vant'
import { fieldNamesData } from '../utils/cityData'

export default ({ handleArea, area }) => {
let defaultCity = ['北京市', '北京市', '东城区']
let preCity = null
if (area) {
preCity = area.split(',').filter((o) => o)
defaultCity = preCity
}
const [value, setValue] = useState(defaultCity)
return (
<ConfigProvider
themeVars={{
rvPickerOptionTextColor: '#FF4901',
// '--rv-picker-option-text-color': '#FF4901',
// '--rv-picker-option-text-color--selected': '#FF4901',
}}
>
<Picker
confirmButtonText={
<span
style={{
color: '#FF4901',
fontSize: '16px',
lineHeight: '20px',
}}
>
确定

}
cancelButtonText={
<span
style={{
color: '#666',
fontSize: '16px',
lineHeight: '20px',
}}
>
取消

}

    itemHeight={44}
    visibleItemCount={4}
    popup={{
      round: true,
    }}
    value={value}
    placeholder={''}
    columns={fieldNamesData}
    columnsFieldNames={{
      text: 'cityName',
      children: 'cities',
    }}
    onConfirm={(v) => {
      setValue(v)
      handleArea(v.join(','))
    }}
  >
    {(val, _, actions) => {
      return (
        <Field
          isLink={true}
          style={{ color: '#999' }}
          readOnly
          clickable
          controlAlign="right"
          value={isEmpty(preCity) ? preCity : val || ''}
          placeholder="选择城市"
          onClick={() => actions.open()}
        />
      )
    }}
  </Picker>
</ConfigProvider>

)
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant