jspsych-react v0.3.0

Getting Started

npm install jspsych-react

You can use the Experiment component to include a jsPsych experiment in your React project. For example:

import React, { Component } from 'react'
import { Experiment } from "jspsych-react";
import { visualOddball } from "./examples/timelines";
import { callbackHTMLDisplay, callbackImageDisplay } from "./examples/plugins";

export default class ExperimentComponent extends Component {
  render() {
    return (
      <div>
        <Experiment
          settings={{ timeline: visualOddball }}
          plugins={{
            "callback-html-display": callbackHTMLDisplay,
            "callback-image-display": callbackImageDisplay
          }}
        />
      </div>
    );
  }
}

You can also import the jsPsych object to access other jsPsych functionality, such as updating the progress bar during a jsPsych experiment. For example:

import { jspsych } from "jspsych-react";

export const updateProgress = () =>
  jsPsych.setProgressBar(
    jsPsych.progress().current_trial_global / jspsychObject.sample.size
  );

API

Props

Experiment

License

MIT © Teon Brooks