FortuneSheet Document

# Overall configuration

# Basic Structure

Below is a simple configuration example:

// Configuration item
const settings = {
     data: [{ name: 'Sheet1', celldata: [{ r: 0, c: 0, v: null }] }], // sheet data
     onChange: (data) => {}, // onChange event
     lang:'zh' // set language
     // More other settings...
}

// Render the workbook
<Workbook {...settings} />

Workbook props will affect the entire workbook. The configuration of a single worksheet needs to be set in the settings.data array to set more detailed parameters. Refer to Worksheet Configuration

For personalized needs, in addition to allowing configuration information bar toolbar (showToolbar), formula bar (showFormulaBar) and bottom sheet bar (showSheetTabs), FortuneSheet has opened more detailed custom configuration options, which are as follows:

# Configuration item

The following are all supported setting parameters

# lang

  • Type: String
  • Default: "zh"
  • Usage: Internationalization settings, allow to set the language of the table, support simplified Chinese ("zh"), English ("en") and traditional Chinese ("zh_tw") and Spanish ("es")

# data

# onChange

  • Type: Function
  • Default: undefined
  • Emitted when workbook data has changed

# column

  • Type: Number
  • Default: 60
  • Usage: The default number of columns in an empty workbook

# row

  • Type: Number
  • Default: 84
  • Usage: The default number of rows in an empty workbook

# showToolbar

  • Type: Boolean
  • Default: true
  • Usage: Whether to show the toolbar

# toolbarItems

  • Type: Array
  • Usage: Custom configuration toolbar,can be used in conjunction with showToolbar, toolbarItems has a higher priority.
  • Format:
	[
		"undo",
		"redo",
		"format-painter",
		"clear-format",
		"|",
		"currency-format",
		"percentage-format",
		"number-decrease",
		"number-increase",
		"format",
		"font-size",
		"|",
		"bold",
		"italic",
		"strike-through",
		"underline",
		"|",
		"font-color",
		"background",
		"border",
		"merge-cell",
		"|",
		"horizontal-align",
		"vertical-align",
		"text-wrap",
		"text-rotation",
		"|",
		"freeze",
		"sort",
		"image",
		"comment",
		"quick-formula",
	]

# showSheetTabs

  • Type: Boolean
  • Default: true
  • Usage: Whether to show the bottom sheet button

# devicePixelRatio

  • Type: Number
  • Default: window.devicePixelRatio
  • Usage: Device ratio, the larger the ratio, the higher the resolution of the workbook

# cellContextMenu

  • Type: Array
  • Default: []
  • Usage: Custom configuration cell right-click menu
  • Format:
    [
	"copy", // 复制
	"paste", // 粘贴
	"|",
	"insert-row", // 插入行
	"insert-column", // 插入列
	"delete-row", // 删除选中行
	"delete-column", // 删除选中列
	"delete-cell", // 删除单元格
	"hide-row", // 隐藏选中行和显示选中行
	"hide-column", // 隐藏选中列和显示选中列
	"clear", // 清除内容
	"sort", // 排序选区
	"filter", // 筛选选区
	"chart", // 图表生成
	"image", // 插入图片
	"link", // 插入链接
	"data", // 数据验证
	"cell-format" // 设置单元格格式
]

# sheetTabContextMenu

  • Type: Object
  • Usage: Customize the right-click menu of the bottom sheet bar
  • Format:
    [
	"delete",
	"copy",
	"rename",
	"color",
	"hide",
	"|",
	"move"
]

# rowHeaderWidth

  • Type: Number
  • Default: 46
  • Usage: The width of the row header area, if set to 0, it means to hide the row header

# columnHeaderHeight

  • Type: Number
  • Default: 20
  • Usage: The height of the column header area, if set to 0, it means hide the column header

# showFormulaBar

  • Type: Boolean
  • Default: true
  • Usage: Whether to show the formula bar

# defaultFontSize

  • Type：Number
  • Default：11
  • Usage：Initialize the default font size

← Sheet Configuration →