加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react读取静态文件

发布时间:2020-12-15 20:33:32 所属栏目:百科 来源:网络整理
导读:react中,使用发送请求的方式把static文件夹中的前端可访问的静态文件读取成字符串: import React,{ Component } from ‘react‘ ; import { getRequestHeaders } from ‘../setupAjaxHeaders‘ ; import HyperDown from ‘hyperdown‘ ;import ‘./ReadMeP

react中,使用发送请求的方式把static文件夹中的前端可访问的静态文件读取成字符串:

import React,{ Component } from ‘react‘;

import { getRequestHeaders } from ‘../setupAjaxHeaders‘;
import HyperDown from ‘hyperdown‘;

import ‘./ReadMePage.css‘;


class ReadMePage extends Component {
    constructor(props){
        super(props);
this.state={ readmeHtml:undefined,}; } render(){ const getArtifactRequest = new Request(require(‘../static/readme.md‘),{ method: ‘GET‘,headers: new Headers(getRequestHeaders(document.cookie)) }); fetch(getArtifactRequest).then((response) => { return response.text() }).then((text) => { const parser=new HyperDown; this.state.readmeHtml=parser.makeHtml(text); this.setState({ readmeHtml:parser.makeHtml(text),}); return <div id="readMeBody" dangerouslySetInnerHTML={{__html:this.state.readmeHtml}}></div>; }); return <div id="readMeBody" dangerouslySetInnerHTML={{__html:this.state.readmeHtml}}></div>; } } export default ReadMePage;

?

注意,要保存代码中动态生成的结果,必须在构造函数中定义 this.state={resultname:undefined,} 并在生成结果时调用this.setstate({ resultname:result,}),然后后续调用的时候使用this.state.resultname

?

注意,request获取response之后,response.text()需要通过return再then才能获取到,直接使用是获取不到的

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读