编辑滚动的问题

dev_newshixunModel
hjm 5 years ago
parent c8d0a0ec9b
commit a10a7608da

@ -70,10 +70,23 @@ class NewWorkForm extends Component{
contentFileList,
answerFileList,
}, () => {
setTimeout(() => {
this.contentMdRef.current.setValue(data.description || '')
this.answerMdRef.current.setValue(data.reference_answer || '')
}, 2000)
// setTimeout(() => {
// this._scrollToTop()
// 阻止setValue的滚动
// $(window).scroll( function() {
// $("html").scrollTop(0)
// $(window).unbind("scroll");
// });
/**
setValue会调用到 codemirror的 o.scrollIntoView(i), 会导致滚动条跳动
*/
// $('.editormd').parent().css('position', 'fixed').css('left', '-1000px')
// this.contentMdRef.current.setValue(data.description || '')
// this.answerMdRef.current.setValue(data.reference_answer || '')
// setTimeout(() => {
// $('.editormd').parent().css('position', '').css('left', 'auto')
// }, 100);
// }, 500)
this.props.form.setFieldsValue({
title: data.name,
@ -85,12 +98,13 @@ class NewWorkForm extends Component{
} else { // new
}
this._scrollToTop()
// this._scrollToTop()
}
_scrollToTop = () => {
setTimeout(() => {
$("html").animate({ scrollTop: 0 })
}, 1500)
// setTimeout(() => {
$("html").scrollTop(0)
// $("html").animate({ scrollTop: 0 })
// }, 1000)
}
// 输入title
@ -303,15 +317,13 @@ class NewWorkForm extends Component{
let{
title_value, contentFileList, answerFileList, max_num, min_num, base_on_project,
init_max_num, init_min_num,
title_num, course_name, category, has_commit, has_project,
isEdit
title_num, course_name, category, has_commit, has_project
}=this.state
const { current_user } = this.props
const courseId = this.state.course_id || this.props.match.params.coursesId ;
if ((isEdit) && !this.state.workLoaded) {
this.isEdit = this.isEdit || this.props.match.url.indexOf('/edit') != -1
if ((this.isEdit) && !this.state.description) {
return ''
}
const uploadProps = {
@ -439,7 +451,8 @@ class NewWorkForm extends Component{
}],
})(
<TPMMDEditor ref={this.contentMdRef} placeholder="请在此输入作业内容和要求,最大限制5000个字符" mdID={'courseContentMD'} refreshTimeout={1500}
className="courseMessageMD" initValue={this.state.description}></TPMMDEditor>
initValue={this.state.description} noSetValueOnInit={!!this.isEdit}
className="courseMessageMD" ></TPMMDEditor>
)}
</Form.Item> }
<Upload {...uploadProps} className="upload_1 newWorkUpload">
@ -507,7 +520,8 @@ class NewWorkForm extends Component{
}],
})(
<TPMMDEditor ref={this.answerMdRef} placeholder="请在此输入作业的参考答案,最大限制5000个字符" mdID={'workAnswerMD'}
className="courseMessageMD" refreshTimeout={1500} initValue={this.state.reference_answer || ''}></TPMMDEditor>
initValue={this.state.reference_answer || ''} noSetValueOnInit={!!this.isEdit}
className="courseMessageMD" refreshTimeout={1500} ></TPMMDEditor>
)}
</Form.Item>
<Upload {...answerUploadProps} className="upload_1 newWorkUpload resetNewWorkUpload">

@ -16,7 +16,7 @@ class CBreadcrumb extends Component{
return ''
}
if (item.to) {
return <React.Fragment>
return <React.Fragment key={index}>
<WordsBtn style="grey" className="fl hovercolorblue" to={item.to}>{item.name}</WordsBtn>
{separator ?
<span className="color-grey-9 fl ml3 mr3">{separator}</span> :
@ -24,7 +24,7 @@ class CBreadcrumb extends Component{
}
</React.Fragment>
} else {
return <span>{item.name}</span>
return <span key={index}>{item.name}</span>
}
})}
</p>

@ -236,19 +236,24 @@ export default class TPMMDEditor extends Component {
setTimeout(() => {
if (that.props.needRecreate == true) {
__editorName.recreate()
__editorName.recreate() // 注意 必须在setValue之前触发不然会清空
} else {
__editorName.resize()
}
console.log('timeout', __editorName.id)
__editorName.cm && __editorName.cm.refresh()
}, that.props.refreshTimeout || 500)
if (that.props.initValue != undefined && that.props.initValue != '') {
__editorName.setValue(that.props.initValue)
}
if (that.state.initValue) {
__editorName.setValue(that.state.initValue)
if (this.props.noSetValueOnInit) {
that.onEditorChange()
} else {
if (that.props.initValue != undefined && that.props.initValue != '') {
__editorName.setValue(that.props.initValue)
}
if (that.state.initValue) {
__editorName.setValue(that.state.initValue)
}
}
__editorName.cm.on("change", (_cm, changeObj) => {
that.contentChanged = true;
if (that.state.showError) {
@ -277,6 +282,7 @@ export default class TPMMDEditor extends Component {
onEditorChange = () => {
if (!this.answers_editormd) return;
const val = this.answers_editormd.getValue();
//console.log('onEditorChange', this.props.id, val)
try {
this.props.onChange && this.props.onChange(val)
} catch(e) {

Loading…
Cancel
Save