Using react.js as plugin

Plugins
1

Does anyone tried to use React.js as plugin? Is there any way to do this?

2

Hello @rafikoff
Do you mean as framework? ONLYOFFICE Docs React component - ONLYOFFICE Api Documentation
If I misunderstood the situation, please provide us with details on your desired usage scenario.

3

I have a react application that I want to use as onlyoffice plugin (Getting started with plugins - ONLYOFFICE Api Documentation).
But I can’t find any documentation page that can explain to me how to use react app in plugins instead of vanilla js.

4

Yes, you can use React.js as an ONLYOFFICE plugin. Compile your React app into a single JavaScript file, create the plugin structure as per the ONLYOFFICE guide,User Guides - ONLYOFFICE and embed the compiled file into the plugin. Initialize your React app within the plugin’s DOM element.

2 Likes
5

Thank you!
What if I want to use Asc.scope to exchange data between only office and react application?
For example, my react application is designed to build charts based on data from onlyoffice:

const ChartSection = () => {
const data = //get data from some range {for example A2:A10} in worksheet
  return(
    <div>
       <Chart
           type = {'bar'}
           dataset = {data}
       />
    </div>
  )
}
6

We’ll try to check it out. I will update this thread when we have something to share.

8

Hello @rafikoff
It should work this way:

function setAscScope() {

Asc.scope.data = "Hello world!";

connector.callCommand(function () {

var oWorksheet = Api.GetActiveSheet();

oWorksheet.GetRange("B1").SetValue(Asc.scope.data);

var data = oWorksheet.GetRange("B1").GetValue();

return data

},

(data) => { console.log(data) }),

isNoCalc = true

}