代码演示

本页展示文档支持的代码呈现方式。以下示例只演示基础数据和本地界面交互，不调用 eduskit SDK 或真实课堂服务。

多语言代码块

点击语言标签切换示例，使用代码块右上角的按钮复制代码。

TypeScript

classroom.ts

const classroom = {
  id: 'demo-classroom',
  role: 'teacher',
};

console.log(classroom.id);

Swift

Classroom.swift

let classroom = [
    "id": "demo-classroom",
    "role": "teacher"
]

print(classroom["id"] ?? "")

Kotlin

Classroom.kt

val classroom = mapOf(
    "id" to "demo-classroom",
    "role" to "teacher"
)

println(classroom["id"])

实时编辑与预览

修改下面的 JSX，预览会即时更新。也可以点击预览中的按钮，体验本地 React 状态变化。

实时编辑器

function ClassroomCounter() {
  const [count, setCount] = useState(0);
  return (
    <div style={{ padding: 20 }}>
      <p>课堂互动次数: {count}</p>
      <button type="button" className="button button--primary" onClick={() => setCount(count + 1)}>
        添加一次互动
      </button>
    </div>
  );
}

结果

Loading...

配置示例与高亮

JSON 示例可以用于讲解配置字段；这里的值仅用于演示，不是有效凭证。

example.json

{
  "classroomId": "demo-classroom",
  "displayName": "Demo teacher"
}

阅读提示

页面支持明暗主题、语言切换、目录定位与全文搜索。真实的课堂示例将在 SDK 指南完成后逐步加入。