Handsontable not recognising custom formula - vue.js

I created a simple handsontable with a custom formula, but I cannot get it to work.
I followed the example in the HyperFormula docs but the function is not being recognised by the library.
Here is an example:

Updated for everyone looking for the answer https://codesandbox.io/s/nice-worker-yjcsjw the HyperFormula.registerFunctionPlugin has to be called before the instance is created. It is mentioned here in the docs: https://hyperformula.handsontable.com/api/classes/hyperformula.html#registerfunctionplugin

Related

How to add a comment to a Vue SFC outside any of the root elements?

I'm in a situation where I legally have to add a copyright notice to the top of my files and while I know how I can comment inside either template, script or style, I couldn't find documentation regarding how to do it outside these.
Based on the structure of the file, I assume the standard HTML comment (<!-- Hi there! -->) should work, and it both: a.) seems to work and b.) my syntax highlighter accepts it.
However, I'd like to be sure about it and understand how and why it works this way, I was surprised it is seemingly not covered in the Vue docs.
Yep, you are right. There is a confirmation here: https://vue-loader.vuejs.org/spec.html#src-imports

Is it possible to use more than one "template" element in one component in vuejs?

This question triggered in my mind while reading through Vue's official guide here.
I don't know if I find the answer to this question on proceeding further to read more from the official guide, but curious to know if it's possible or not.
Well, I'll update here as soon as I got to know the answer.
Screenshot from official guide
A component must use a single template or component option object, and that template must provide a single root element to mount. The template is converted into a render function internally, and Vue can only have 1 render function.
Your component can in turn contain a component that is dynamic, however.
https://v2.vuejs.org/v2/guide/components-dynamic-async.html

How can I access child component data from a parent in Vue?

I am trying to access data from a single-file component in Vue, but can't find any way of doing it. I have tried using $emit, but can't get thath to work either. The data string has to be blank as it gets modified by an input field.
I have seen others' solutions here on SO, but either the don't fit with my problem or I can't get them to work. I want to try to keep it as simple and understandable as possible.
You can use the special attribute ref:
<child-comp ref="child"></child-comp>
In JS:
vm.$refs.child.YOUR_DATA
Hope this helps!

Implementing custom search in datatables.net with angular 4

I'm trying to implement a simple custom search on a column.
This is well documented at https://datatables.net/examples/plug-ins/range_filtering.html.
However my (so far) only problem is accessing the $.fn.dataTable.ext.search array, to add and later remove my custom search function.
What is the path for this array, when going through angular-datatables?
Thanks in advance for your help.
this.datatableElement.dtInstance.then((dtInstance: DataTables.Api) => {
dtInstance. <-- what goes here?
});
Was solved by the developer at https://github.com/l-lin/angular-datatables/issues/1111
It was because the typings were not complete, when using typescript in angular.
Correct reference is $.fn['dataTable'].ext.search

Difference between Ext.widget() and Ext.ComponentQuery.query()?

I have a component I created that extends Ext.window.Window, I've given it an alias of 'widget.customereditor'. Once I've created an shown an instance of this component both of the following pieces of code seem to be getting a reference to the same thing:
Ext.ComponentQuery.query('customereditor')[0];
Ext.widget('customereditor');
The problem is when I try to execute the close method on the returned object. So the following does work and closes the window:
Ext.ComponentQuery.query('customereditor')[0].close();
While this does not work:
Ext.widget('customereditor').close();
I'm wondering what the difference is between the two ways of querying?
After reading the API docs I found the answer. It turns out that Ext.widget does not actually query for an existing instance of a component in the DOM but instead creates new instances of components by their xtype. Ext.ComponentQuery should be used to find existing instances of components.