1.0.1 • Published 9 months ago
cp_fan_components_react v1.0.1
用于全品服务的组件库 react ts 版本
组件使用方法
node 版本 17.9.0
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-redux": "^8.0.4",
"react-router-dom": "^6.4.2",
"react-scripts": "5.0.1",
"typescript": "^4.8.4",
npm i cp_fan_components_react --save
import { QuestionItem } from 'cp_fan_components_react/index';
<QuestionItem
ques={ques}
showQuestionNum={true}
questionIndex="1"
showKnowledge={false}
showExplain={true}
></QuestionItem>
样例演示代码
import { CpQuestionDetail } from 'cp_fan_components_react/index';
const CpQuestionExample: React.FC = () => {
return <CpQuestionDetail></CpQuestionDetail>;
};
参数描述
type QuestionItemType = {
ques: any; // 全品 试题 数据
showQuestionNum?: boolean; // 是否显示大题题号
questionIndex?: number | string; // 题号顺序
showExplain?: boolean; // 是否显示 答案解析
showKnowledge?: boolean; // 是否显示 知识点
};
ques :单个试题对象 基本结构
{
questionId: '8f06016e-3f7a-4e99-9d2e-3d5e41f595f4',
source: 1,
stageSubject: { code: '1313', name: '高中英语' },
context: {
stem: '题干内容',
audio: null,
original_text: null,
options: null,
},
quesType: { code: '24', name: '阅读理解' },
quesStruct: { code: '16', name: '多小题模板' },
knowledge:[],
children:[]
}
试题样式问题
如果 自己写 试题渲染器
试题内容的样式
第一种方法
在组件中找到
import 'cp_fan_components_react/assets/css/question_style.css'
第二种方法
http://static-file-01-cdn.canpoint.cn/tiku/img/question_style.css?t=20201022
放入 index.html
<link rel="stylesheet" href="http://static-file-01-cdn.canpoint.cn/tiku/img/question_style.css?t=20201022" />
第三中方法
# 无法引入 由销售提供的样式
1.0.1
9 months ago