Пройдите парам от мопса до JSX

Question

Я строю игру, используя Express и React. Мне нужно получить доступ к userId в моем файле index.jsx, чтобы выполнять действия на моих контроллерах, например, увеличивать счет пользователя.

Мой маршрут визуализирует index.pug файл во время прохождения user_id параметров:

//server.js 
app.get('/', function (req, res) { 
    const userId = req.query.userId 
    res.render('index', {userId: userId}) 
}) 

Тогда я могу получить доступ к userId в моем файле мопса, как это:

// index.pug 
body 
    div#errors 
    #root 
    p #{userId} // prints the User Id 

Теперь мне нужно получить доступ к этому userId param в моем файле index.jsx, который содержит компоненты React.

class Cell extends React.Component { 
    render() { 
     return (
     <button onClick={() => this.props.onClick()}> 
      {userId} 
     </button> 
    ) 
    } 
    }  

Но это не работает, как я и ожидал. Есть идеи?

Answer 1

Вы можете сделать, используя window объект

Допустим, в файле .pug

script. 
    var userId = '#{userId}'; //assigning pug value to window object. 

Теперь вы можете получить доступ к userId в react компоненте, как window.userId

class Cell extends React.Component { 
    render() { 
     return (
     <button onClick={() => this.props.onClick()}> 
      {window.userId} 
     </button> 
    ) 
    } 
    }