reactV6，引入V5.22里的List，结合 react-beautiful-dnd 实现拖拽排序，chrome浏览器报错list.map未定义？

在使用的react版本如下：

已写的代码：

import React, { useState } from 'react'
import { DragDropContext, Draggable, Droppable, } from 'react-beautiful-dnd'
import { List } from 'antd-mobile'
const reorder = (list, startIndex, endIndex) => {
    const result = Array.from(list);
    const [removed] = result.splice(startIndex, 1);
    result.splice(endIndex, 0, removed);
    return result;
}
function Favorite() {
const [list, setList] = useState('');
    const onDragEnd = (result) => {
        if (!result.destination)
            return;
        const newList = reorder(list, result.source.index, result.destination.index);
        setList([...newList]);
    }

    return (
        <div>
          {/* 结合 react-beautiful-dnd 实现拖拽排序 */}
          <List>
            <DragDropContext onDragEnd={onDragEnd}>
              <Droppable droppableId='droppable'>
                {droppableProvided => (<div ref={droppableProvided.innerRef}>
                    {list.map((item, index) => (<Draggable key={item.id} draggableId={item.id} index={index}>
                        {(provided, snapshot) => (<div ref={provided.innerRef} {...provided.draggableProps} {...provided.dragHandleProps} style={Object.assign(Object.assign({}, provided.draggableProps.style), { opacity: snapshot.isDragging ? 0.8 : 1 })}>
                            <List.Item>
                              {item.name}
                            List.Item>
                          div>)}
                      Draggable>))}
                    {droppableProvided.placeholder}
                  div>)}
              Droppable>
            DragDropContext>
          List>
        div>
    )
}

chrome浏览器报错：
Uncaught TypeError: list.map is not a function

请问代码出了什么问题？如何解决？请展示代码举例说明。