Mariana Gomez-Kusnecov
Mariana Gomez-Kusnecov

Reputation: 245

TypeError: Cannot assign to read only property 'exports' of object '#<Object>' in ReactJS

So what I'm trying to achieve is taking a variable from a page in my app and be able to use it in other pages. This variable is manipulated from the navbar that is accessible from every page it is needed. The "App.js" is basically just a navbar and the other pages display underneath it. The other pages need the values selected/assigned from the navbar in order to pull info from the database.

App.js

let year;
let term;

class App extends Component {

  render() {
    // Here I do things and assign the variables on top values
  }

export default App;

module.exports = year;
module.exports = term;

Then, on one of my pages

var year = require("./AdminApp");
var term = require("./AdminApp");

class ViewStudents extends Component {
  constructor(props) {
    super(props);

    this.state = {
      year: year,
      term: term
    }
  }

  render() {
    // Do more magic
  }

export default ViewStudents;

These are summarized versions of my code that include the parts I'm having trouble with. Any help is appreciated! Thanks in advance!

Upvotes: 0

Views: 303

Answers (1)

Amit Chauhan
Amit Chauhan

Reputation: 6869

use named export like this.

App.js

let year;
let term;

class App extends Component {

  render() {
    // Here I do things and assign the variables on top values
  }

export default App;
export { year, term };

In your page:

import { year, term } from "./AdminApp";

class ViewStudents extends Component {
  constructor(props) {
    super(props);

    this.state = {
      year: year,
      term: term
    }
  }

  render() {
    // Do more magic
  }

export default ViewStudents;

Upvotes: 2

Related Questions