正则表达式的使用案例：批量添加题目功能实现

2023-12-10 18:30:43

纯文本输入

首先，我们需要将纯文本输入转换为对象。我们可以使用正则表达式来做到这一点。以下正则表达式将匹配任何以数字开头的行，后面跟着一个句号和一个空格，然后是题目的文本：

^([0-9]+)\.\s(.*)

我们可以使用这个正则表达式来创建一个生成器函数，它将从纯文本输入中提取题目并将其转换为对象：

def parse_questions(text):
    for match in re.finditer(r"^([0-9]+)\.\s(.*)", text):
        yield {
            "number": match.group(1),
            "text": match.group(2),
        }

2. 解析文本

现在我们已经有了可以解析纯文本输入并将其转换为对象的生成器函数，我们可以使用它来解析文本并创建题目对象列表。

text = """
1. 这是什么问题？
2. 这是另一个问题。
3. 这是最后一个问题。
"""

questions = list(parse_questions(text))

3. 渲染题目组件

现在我们已经有了题目对象列表，我们可以使用它们来渲染题目组件。我们可以使用任何我们喜欢的框架或库来做到这一点。例如，我们可以使用 React 来渲染题目组件：

import React, { useState } from "react";

const Question = ({ number, text }) => {
    const [isOpen, setIsOpen] = useState(false);

    return (
        <div>
            <button onClick={() => setIsOpen(!isOpen)}>{number}. {text}</button>
            {isOpen && <div>{text}</div>}
        </div>
    );
};

const App = () => {
    const questions = [
        { number: 1, text: "这是什么问题？" },
        { number: 2, text: "这是另一个问题。" },
        { number: 3, text: "这是最后一个问题。" },
    ];

    return (
        <div>
            {questions.map((question) => (
                <Question key={question.number} {...question} />
            ))}
        </div>
    );
};

export default App;