I created a Quasar dialog component to show errors to users in the form of popups. I maintain a variable for q-dialog to show up (i.e., <q-dialog v-model="show">, where show is a reactive and set to true in setup()). I use this component from another component as such <Error v-if="movieChoiceStatus.error" :textContent="movieChoiceStatus.errorText" :show="true"/> where movieChoiceStatus is a reactive as well. The problem is Error component shows up only once. It won't pop after initial one. Does anybody have an idea?
It looks like you're using a prop for your dialog model. I can't be sure without seeing more of the code, but you might try removing the "show" prop, and just having it as a ref in the Error component set in the setup.
Related
I am trying to wrap FullCalendar React component with my own functional React component with useContext hook to access MobX store (I might use the store in other components eventually) and observer() to make it react to changes in the store. My component reacts as I would expect, but I have trouble making the FullCalendar component render after a change.
I've tried finding a solution, wrapping <FullCalendar> in <Observer>, playing with autorun() and reaction() but nothing worked. I have to be missing something
This sandbox https://codesandbox.io/s/mobx-fullcalendar-xejn9 shows a simplified version of my solution so far.
Clicking the button at the top adds an event to the observable store, which gets shown in a list below it. But the calendar doesn't show the new event.
Weirdly enough if I make a change in the code, save it, the CodeSandbox causes the render and the events show up in the calendar.
Thanks to #ADyson, I found a solution. Instead of passing a static list of events to the FullCalendar component
events={store.events}
I can pass an event fetching function. So in the most trivial case, I can just pass the events from the store to the successCallback function and it works.
events={(fetchInfo, successCallback, failureCallback) => {
successCallback(store.events);
}}
I've updated the CodeSandbox https://codesandbox.io/s/mobx-fullcalendar-xejn9 as well.
I'm making a plugin that gets the actual panel or text selection and runs a command on the cli with that value and some params that the user adds in a input.
The idea is to have a similar view than find-and-replace package, but from the first beginning I wasn't able to use space-pane-views for a error on jQuery.
So I decided to make it with React and as far as I was making everything was okayish, but I found 2 big problems.
First I understand what's the View of space-pan and all the ShadowDOM that uses, I feel that is not compatible with React at all, is some kind of big Model that gets data from the dom and from some methods.
So I created a <input /> and I figuret out that you can't interact as normal as a website with that input, doesn't have the hability of delete normally the text and you can't use the atom-text-editor styles into it.
in another hand I try to create a Custom Web Component with React like:
<atom-text-editor
{...this.props}
mini
tabindex='-1'
class={`${this.props.className}`}
data-grammar='text plain null-grammar'
data-encoding='utf8'
/>
and it works with inheriting the styles, but I can't access to the content of the Shadow DOM, neither add eventHandlers like onChange (onKeyPress works btw), this is basically a problem more than React that Atom, but is as far as I went in the intention to create a View in Atom.
Another option could be add draft-js from Fb, but it's a crazy idea for create a simple input.
Any idea to solve one of both problems?
Thanks!
If you add a normal input in React with className='native-key-bindings' the input contains the nativew key bindings, and you can attach the eventHandlers there.
I was working on creating my custom "Button" class... Im not using CCMenuItems because I need some flexibility in my buttons.
My implementation is the following:
DMenuButton : CCSprite <CCTargetedTouchDelegate>
When created, the button receives a target and selector, and builds an NSInvocation. When touched, the invocation is called. I will use this buttons mainly to go from one layer to another.
The problem is that when going from a layer to the next, and then back to the previous, something strange occurs: either no sprites are loaded into the next view or an EXC_BAD_ACCESS error is thrown.
Can anyone help me with this?
Thanks!
PS: My theory is that it has to do with the NSInvocation and the "dealloc" method.
Am I doing something wrong?
Currently meteor supports a limited number of events that we can react to from our template definitions. I would like a way to react to events beyond this predefined list. I want the freedom to add any event, even custom events, to the list of possible events in a template.
One idea I had would be to set up a jquery event handler somewhere that listens for the unsupported event and have it set a session variable:
$(form).submit( ->
Session.set('formSubmitted', true)
And then use that session variable when rendering a template:
Template.confirmation.submitted = ->
return Session.get('formSubmitted')
<template name="confirmation">
{{#if submitted}}
<!-- do whatever -->
{{/if}}
</template>
But this is just a workaround and doesn't really address the issue. Is there a real Meteor-way of doing this? Is this something I can do with the new Spark implementations?
NOTE: Please ignore the fact that I'm using the submit event here. I know I can just bind a click event to the submit button, but that's beside the point.
NOTE 2: The accepted answer to this question is also just a workaround.
The rendered callback is what I use to do this.
http://docs.meteor.com/#template_rendered
The callback gives you template instance you should use to find the dom elements you need: http://docs.meteor.com/#template_inst
Untested example below ;)
Template.foo.rendered = ->
$(this.find("form")).submit ->
Session.set 'formSubmitted', true
Using a Session variable than to switch the view is a matter of taste I think.
I have an app State stored in the Session, that toggles Templates. Additionally the backbone package is very useful to provide some meaningful urls.
I have a main application calling several ViewStack states, each with popup windows. If I don't open any popup windows, I can move between states fine. If I open a popup window then try to change the state using currentState=... I get the error:
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at spark.components::Scroller/focusInHandler()[E:\dev\4.y\frameworks\projects\spark\src\spark\components\Scroller.as:2139]
at flash.display::Stage/set focus()
at mx.core::UIComponent/setFocus() [E:\dev\4.y\frameworks\projects\framework\src\mx\core\UIComponent.as:9905]
...
I see others having the same problem, for example here:
http://forums.adobe.com/thread/1031531
http://forums.adobe.com/message/2767130
http://forums.adobe.com/message/3448443
http://forums.adobe.com/thread/655749?tstart=-1
http://forums.adobe.com/thread/801149
http://flex4examples.wordpress.com/2011/05/05/skinnabletextbase-focusmanager-runtime-error-popup/
http://bugs.adobe.com/jira/browse/SDK-32036?page=com.atlassian.jira.plugin.system.issuetabpanels%3Aall-tabpanel
But I haven't figured out how to implement the recommended solution. It sounds like I should just include:
import mx.managers.PopUpManager; PopUpManager;
inside my main application and it should work, but it doesn't work for me.
My application has each view state in a different file, each defined using <views:View>. Also, all of the popups are separate files defined as <s:TitleWindow>. Each file includes this line:
import mx.managers.PopUpManager;
I wonder if this means each file is using a different popup manager(?), when it's a singleton and only one should be used for the whole app (how to set that up?).
The code I use to call a popup is:
var _popupName:MyTitleWindowFileName = MyTitleWindowFileName(
PopUpManager.createPopUp(this, MyTitleWindowFileName, true));
_popupName.addEventListener(MyAppController.CLOSE_POPUP,onClosePopUp);
PopUpManager.centerPopUp(_popupName); // call popup
Note that when the main application (the one defined as <s:Application>) runs, the ViewStack states have not been loaded yet (since they get loaded when they are used the first time). Not sure if that has any cause/effect here.
I've tried to follow Adobe's example code in the "Passing data to and from a Spark pop-up window" section here:
http://help.adobe.com/en_US/flex/using/WS6c678f7b363d5da52e8f1ca1124a0430dcf-8000.html#WS6c678f7b363d5da52e8f1ca1124a0430dcf-7ffe
Any ideas much appreciated.
Based on your comments, it seems like the error occurs because the focus remains in the popup. I would expect the PopUpManager and FocusManager classes to handle this better.
One thing I can think of is that the FocusManager may be trying to handle this. But since the state changes, the item that originally had focus (in the view stack child, before the pop up was opened) may no longer be there when the view state changes. Just a hunch, w/out seeing your code.
Here's some things you can do to either work around the problem (or better) further debug it to understand what is happening:
Use FocusManager.setFocus() to move the focus back to an object in the view stack child before closing the pop up
Use FocusManager.getFocus() to debug and see where it thinks the focus is at various stages (before opening popup, before/after changing state, and before/after closing pop up).
It appears this is the situation I'm experiencing:
Adobe Air: scroller throws error when changes focus between different applications
It's an Adobe bug. Solution from Adobe is:
This bug is easily fixed by changing Scroller to do a null pointer check on focusManager before using it.
which is what the first link above attempts to do.
Another link: http://forums.adobe.com/message/3812805