我目前正在使用react-native-markdown-show来处理我的聊天数据.但我不确定如何为表格边框 colored颜色 添加样式,也没有提及文档. 我找到了一种改变外部边界 colored颜色 的方法,but no luck with the bottom border of the head row.还有什么方法可以改变它的 colored颜色 吗?

这是markdown :

这是我用来自定义的代码:

 {props.message && (
                <Markdown
                  style={{
                   
                    table: {
                      borderColor: "white",
                      color: "yellow",
                      borderBlockEndColor: "yellow",
                      borderStartColor: "yellow",
                      borderEndColor: "yellow",
                    },
                  }}>
                  {`
# h1 Heading
## h2 Heading
  ### h3 Heading
  #### h4 Heading
  ##### h5 Heading
  ###### h6 Heading 

  Unordered

  + Create a list by starting a line with 
  + Sub-lists are made by indenting 2 spaces:
    - Marker character change forces new list start:
      * Ac tristique libero volutpat at
      + Facilisis in pretium nisl aliquet
      - Nulla volutpat aliquam velit
  + Very easy!

  Ordered

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa

  Start numbering with offset:

  57. foo
  58. bar



  | Option | Description |
  | ------ | ----------- |
  | data   | path to data files to supply the data that will be passed into templates. |
  | engine | engine to be used for processing templates. Handlebars is the default. |
  | ext    | extension to be used for dest files. |

  Right aligned columns

  | Option | Description |
  | ------:| -----------:|
  | data   | path to data files to supply the data that will be passed into templates. |
  | engine | engine to be used for processing templates. Handlebars is the default. |
  | ext    | extension to be used for dest files. |
`}
                </Markdown>
              )}

推荐答案

您可以使用tr来设置内部边界线的样式.

const styles = StyleSheet.create({
    tableBorder: {
      borderWidth: 1,
      borderColor: '#FFF',
      borderStyle: 'solid',
    }
 });
 <Markdown
  style={{
      table: styles.tableBorder,
      tr: styles.tableBorder
  }}>
   {text}
 </Markdown>

Reactjs相关问答推荐

如何等待我的插入内容提交后再继续执行指令?

在一个地方调用函数会影响其他地方调用该函数

props 可以在Reaction中锻造吗?

Tailwind不使用@apply classes构建,并强制使用类似于移动的viewport

使用筛选器的Primereact DataTable服务器端分页?

禁止直接访问Next.js中的页面,同时允许从应用程序内部访问

如何使用useState响应快速/顺序状态更新

是否为Reaction中未使用的组件生成Tailwincss样式?

使用experial_useFormState将参数传递给服务器操作

React 错误无法读取未定义的属性(读取id)#react

如何在PrimeReact的表格中修改筛选图标功能

onChange in useEffect 的最佳实践

如何读取 null 的属性?

类型错误:类型typeof import(js-cookie)上不存在属性get

更新和删除功能不工作 Asp.net MVC React

从一个获取 axios 请求(ReactJS)中删除默认参数

如何在 React 中单击鼠标的位置动态添加 div?

使用 yarn 编译 protobuf js 时出现错误pbjs: command not found

react-query、react-hook-form 和表单验证

如果 URL 已随功能组件更改,则取消刷新