When I integrated the "react-i18next" library it gave an error of "Invalid hook call" because the "useTransition" function is available for function-based components and we have pure class-based components.
So for an alternate solution, I have implemented it on a global level and currently it's working. But, now it has to be called in every page. Is this correct? Shouldn't it be set at the root App level so this is not needed in each child component?
Related
I am in a project right now that uses useReducer + Context API for all state management. The app has grown to the point that state management is getting a little "messy". My question is how best to leverage reselect for performance and reusability in a react app that manages state this way. My assumption would be:
create and export selectors from a separate file
import the selectors into individual react components, and pass in state obtained from useContext,
use the values returned from the selectors in place of the state from context for the rest of the code in the component.
Is it that simple, or is there a better way to do it? Is it worth doing if the app is starting to get bogged down with rerenders??
ps. I can edit this question to include a code example of the steps above if that would be helpful.
I've been using NativeScript for a while in some projects. One think I noticed is that "default" NativeScript directives, such as nsRouterLink, tap and some others does not work with components that I created.
The only times those directives works are when they are using with its default" components such as GridLayout, Label, etc.
I've created a small PlayGround project to demonstrate my issue: https://play.nativescript.org/?template=play-ng&id=rZYQGP&v=3
I think I should import those directives into my custom components somehow, but I have no idea how.
Unfortunately it's not as same as Web with NativeScript, you have to attach the events to the actual element and not on the custom selectors. An alternative is that you can emit an event on your custom component when actual element is tapped.
There is a open feature request already.
I'm no expert but I had same issue recently and could make workaround.
NativeScript's pure component should be registered appropriate
ly on Angular environment to work properly.
This can be done with registerElement from nativescript-angular/element-registry.
By registering, the Angular Component should work like intended element.
Unfortunately, the property of the element can only be accessed with HostBinding
I have forked and applied workaround to PlayGround project you have provided: https://play.nativescript.org/?template=play-ng&id=SCLxVk
I've been developing a web application in CakePHP 2.x that uses an Image cropping tool to manipulate an image. Currently it passes Ajax calls to handle the manipulation onto a function within the current Controller which then calls a Component which contains the main processing and functionality.
I'm currently going through and refactoring this section of the code and I was wondering if it's possible to directly call the Component from Ajax and whether or not it is a good idea or not as it would simplify a chunk of the code if possible.
Thoughts, opinions and tips are greatly appreciated. Thanks :)
I'm currently going through and refactoring this section of the code and I was wondering if it's possible to directly call the Component from Ajax and whether or not it is a good idea or not as it would simplify a chunk of the code if possible.
It's not a good idea because this is how components are thought to be used. A component is not thought to receive a request directly but to provide additional - reuseable functionality - to the controlller level in the MVC pattern.
Taken from the documentation:
Components are packages of logic that are shared between controllers. CakePHP comes with a fantastic set of core components you can use to aid in various common tasks. You can also create your own components. If you find yourself wanting to copy and paste things between controllers, you should consider creating your own component to contain the functionality. Creating components keeps controller code clean and allows you to reuse code between projects.
I want to build a large application in Dart using material design. To accomplish this I included paper_elements into my project. My problem is, that I can't think of a good way to build my multi page application with paper_elements. Usually I create objects which would create their elements inline and add / remove themselves to the dom. The way I understand the paper_element tutorials I found so far this is not possible with them.
Is there a simple way to use paper_elements in dart while having an object based structure? For example I would have my application which loads either a register or login object and displays it in the browser. When logging in it should load a menu object which displays a menu and so on. All page changes should happen without a page reload.
I'm looking forward to all help, examples or links you could provide regarding my problem.
Cheers,
Tim
In Dart you normally build the app as SPA (single page application) without reload.
You can add remove a paper-element like normal DOM elements (div, input, ...) querySelector('#placeholder').append(new Element.tag('paper-input'));
You can also use <template if="{{}}"> or <template repeat="{{}}"> to make Polymer auto-insert these elements when certain conditions are fulfilled or for each value in a collection.
Your question isn't very specific but I guess all you need is already available here on SO as Q/A. Just search for [dart-polymer]. If you don't find anything just ask and we point you in the right direction.
a few that might be relevant
Dart Language: Polymer - Working with views
How to update polymer element bindings after it was removed from DOM and inserted again
How to add attributes to a dynamically created component
how to implement a main function in polymer apps (you don't need a main() when you use a polymer-element that acts as a container for your entire application)
Is imperative Mustache-Binding in Polymer.dart supported?
I am trying to find the way to build complex web pages with MVC3 and AJAX.
I would like to use components to achieve this.
Each component is consisted of it's own model, view and controller.
Multiple components are then placed on some complex view and should act together to
provide desired behaviors.
In some situations, when user performs some action (interaction) with one of the components,
I must update other portions of the page via AJAX.
Component on which action (interaction) occurred, in it's implementation, does not assume anything about view on which it will be used and what portions of the pages should be updated and how.
So when some interaction occurs in some component, I need a mechanism (outside component itself) which will handle this situation and update appropriate parts of the page.
How would you, generally, implement such mechanism?
I would use the Mediator Pattern, also sometimes mistakenly referred to as the manager pattern.
This class would mediate the communication of your components.