These are chat archives for ractivejs/ractive

29th
Jan 2018
Paul Maly
@PaulMaly_twitter
Jan 29 2018 15:11
A question of the day, how you would solve this particular case:
You've some component represented by template below:
<div>
    {{#if foo}}
    <div>
    {{#await bar}}
    ...
    {{/await}}
    </div>
    {{else}}
    <div>
    {{#await baz}}
    ...
    {{/await}}
    </div>
    {{/if}}
</div>
This component needs to be shown when some route, like /mypath/something will be dispatched. But also, one more addition condition needs to be passed to show it. So, final condition to render this component, e.g. route === '/mypath/something' && loggedIn.
In component, we've some foo property, which is user input field or something like this. bar and baz are async things like responses from api requests.
What's your way to solve this case? How do you think what the best way to solve it, using Ractive?
Chris Reeves
@evs-chris
Jan 29 2018 15:20
is the issue that the await blocks don't render?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 15:33
nope, they won't?
Chris Reeves
@evs-chris
Jan 29 2018 15:35
by that, I mean that they're still pending when the server is ready to respond
Paul Maly
@PaulMaly_twitter
Jan 29 2018 15:35
I think this is more architectural question
we can replace await-block to regular variables with async results
<div>
    {{#if foo}}
    <div>
    {{#bar}}
    ...
    {{/bar}}
    </div>
    {{else}}
    <div>
    {{#baz}}
    ...
    {{/baz}}
    </div>
    {{/if}}
</div>
bar and baz contains api responses
Chris Reeves
@evs-chris
Jan 29 2018 16:02
I'm sorry, I'm still not following the question... is it how to handle the loggedIn condition?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 16:13
How to handle all this case, including it
I’ve own solution, but seems someone can suggest more elegant one
Paul Maly
@PaulMaly_twitter
Jan 29 2018 17:22
Any ideas?
Juan C. Andreu
@andreujuanc
Jan 29 2018 18:54
is this a component?
and you want to have the render logic inside the component?
why not let the parnt decide if path and logged in are true then just render this?
maybe i dont understand the question :(
maybe use a function instead of foo? and pass parameters to it?
{{#if shouldRender(food, path, loggedin) }}
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:06
Yes, it’s a component. And it normally has parent
Re: Why not?
You tell me))
foo is data variable inside a component we work with
loggenIn maybe global or parent state variable
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:11
path may include params like any router does
/product/:id
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:49
i woudnt put routing stuff inside a component
im not too found to react-like coding
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:50
ok, so how you do that?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:50
i have "components" and pages separately even if both are Ractive component s
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:51
ok, and?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:51
so that way I keep components small and atomic as possible
in your case i would put the logic where the root is
probably
what are you building ? or it's just an example or design question
if something depends on route, then its more likely to be a page, in my cases at least
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:52
I think this is more architectural question

if something depends on route, then its more likely to be a page, in my cases at least

ok

Juan C. Andreu
@andreujuanc
Jan 29 2018 19:53
i move everything path dependant on page level
then UI > components
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:53
so how exactly you do that?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:54
some components + route logic = page
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:54
page is singleton or what?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:54
keep in mind that my pages are also ractive components
no
but you might use some routing system
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:55
could you please white small example?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:57
year and a half ago i had to write something like this , it was fast (and ugly)
but
please dont judge code xD
i'm in a rewriting process, but it works
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:57
But there I can find solution for my question?
Juan C. Andreu
@andreujuanc
Jan 29 2018 19:58
maybe
thats how i load a "page"
pass it the "request"
then instantiate the component and keep track on it
Paul Maly
@PaulMaly_twitter
Jan 29 2018 19:59
I don't see Ractive there))
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:00
currentView = new View({ el: settings.appTarget, data: { request: request } });
View is the Ractive component
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:01
It looks like server-side code to support loading modules via RequireJS.
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:01
there is no server side there
and require gets replaced by webpack
so everything works with or without require
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:02
"express": "^4.14.0",
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:02
thats just for development
and the demo
devDependencies
;)
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:02
devDependencies ?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:02
yeap
"dependencies": {
"crossroads": "^0.12.2",
"hasher": "^1.2.0"
im rewriting this so its routing system agnostic
it'd work for crossroads and navigo out of the box
each system would require some implementation, but its better than being "married" to one
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:04
so, could you please provide small code snippet how to will load my component using your module?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:06
requirejs or webpack?
webpack is more complicated
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:07
script tag )) actually, it's doesn't matter. I'm not talking about module loading, I'm talking about routing
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:07
ok
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:07
and second part of my question - data fetching
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:07
for routing it uses crossroads, if that ok for you?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:08
doesn't matter, I want to see the principle. even pseudo-code is ok to me)
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:08
script tag is not hard
ah ok
just find any routing system that fits the project you work on
it will give u a simple callback or similar
there "load" the module, which is just a ractive component
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:10
yep
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:11
then instanciate it
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:11
code maybe?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:11
pass it route data, params, query, etc
idk how to answer xD
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:16
my lib is so small that if i write an example i just make a new version of it xD
and its use its so simple
zero config
Routing would depend of what you use. Crossroads for example uses path templates
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:17
Is it does matter?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:18
no it does not
xD
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:18
So?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:18
idk just stating that
Routes > Routes signaling > Callback > Load Logic > Create instance
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:19
Ok, we have some router which provide us some api like:
router('/products/:id', callback);
?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:20
indeed
now you have two options
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:20
and we have Page component like this:
const ProductPage = Ractive.extend()
right?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:20
yeap
match each route to a module, or have some logic to dynamically load the modules
example
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:21
dynamic load doens't matter
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:21
it does
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:21
why?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:21
when you have lots of pages
gonna have to declare everything
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:21
I have 1 component
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:21
its a mess
ok ok xD
so
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:22
so, how to solve my question?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:23
function callback(routeParams) { new ProductPage({el:'#app', data: { route: routeParams} }); }
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:24
We also have a sub component (UI component):
const MyComponent = Ractive.extend({
       template: `
<div>
    {{#if foo}}
    <div>
    {{#bar}}
    ...
    {{/bar}}
    </div>
    {{else}}
    <div>
    {{#baz}}
    ...
    {{/baz}}
    </div>
    {{/if}}
</div>
        `,
       data: () => ({
            foo: true
       })
})
but maybe you don't need to create this page?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:24
i would move the visibility logic to ProductPage , and leave MyComponent clean
const ProductPage = Ractive.extend({ template: ' {{#if something }} <MyComponent /> {{/if}} ' })
Your component is a component, not a page, even if both are ractive components
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:26
But why you render ProductPage if it will be empty?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:26
why it will be empty?, there is nothing more in that template?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:26
yep)
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:26
if you move that logic into MyComponent
everything is gonna be the same
empty
we are not discusing how stuff will render
but when, of IF they will render
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:27

ok, maybe you will do that?:

function callback(routeParams) { if(something) { new ProductPage({el:'#app', data: { route: routeParams} }); } }

?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:28
maybe
depends on what that soemthing is
i think you were talking about authorization right?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:28
it is matter? it's some additional condition
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:28
it does matter
cos in that case, yes its more efficient, BUT, same result
nothing is rendered
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:29
nope)) we just have two conditions to show your page: route matching and one more
or maybe two

cos in that case, yes its more efficient, BUT, same result
nothing is rendered

it's second question, how to do else case?

Juan C. Andreu
@andreujuanc
Jan 29 2018 20:30
you can render a second component
some sort of fallback
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:30
so if your condition is not passed, how to show some other page, for example 404 page
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:30
to act as a redirect
...} else { new Page404(..) }
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:31
ok, I see:
router('/product/:id', function() {
      if (something) {
            new PageComponent();
      } else {
        router.redirect('404')
     }

})
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:32
sure why not
something like that i have in my lib
I have a callback on before render
even Navigo (routing) has hooks, before and after
so you can do that, or even async stuff before calling done and loading the route
i'd move all the routing and authentication out of the pages
that router callback shoudnt have been called if there is a condition that shoud have prevented it
gonna pollute all your routing
with ifs, and conditionals
Chris Reeves
@evs-chris
Jan 29 2018 20:34

i'd move all the routing and authentication out of the pages

+100

Juan C. Andreu
@andreujuanc
Jan 29 2018 20:34
and out of the routing calbaks
backs*
use hooks, or anything you want
automated or manual, doesnt matter
for example
i mark my "pages" like this
Chris Reeves
@evs-chris
Jan 29 2018 20:35
middleware-style routing is super nice for auth-like things
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:36
const ProductPage = Ractive.extend()
ProductPage.allowAnonymous = true;
something like that
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:36
we don't talking about auth and anything else. it's just an additional condition
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:36
might help you reduce code
auth its just an example
but it's one of the most common scenarios
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:36
ok, so if I need to use specific conditions for every route, I need to write tons of middleware function right?
Chris Reeves
@evs-chris
Jan 29 2018 20:36
exactly: pre-conditions for the route
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:36
not always
maybe you can reduce the conditions if you can identity similarities
Chris Reeves
@evs-chris
Jan 29 2018 20:37
do you need specific conditions for every route?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:37
I grouped authentication, but you might find more use cases
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:37
for example
Chris Reeves
@evs-chris
Jan 29 2018 20:37
my experience has been that you have clusters of routes with common conditions
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:37
or exclude some routes from condition, which used in al the others
Chris Reeves
@evs-chris
Jan 29 2018 20:38
mounted sub-"apps" really help there, if your router supports them
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:39
actually, I like page.js and it's middleware routing style.
Chris Reeves
@evs-chris
Jan 29 2018 20:39
if not, filtering middleware based on a common prefix is a generic solution
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:40
i hated page.js xDD xD xD xD
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:40
how to use all of this with global root Ractive component, like App()
?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:40
we only agree on having black&white profile picture :P
uhm
i think you dont need global
why would you?
some sort of master page/layout?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:41
to have layout for example
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:41
i use something different.
I create another component
call it "layout"
and then
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:41
header/footer which not re-rendered on every page
So, I have layout:
<header>...</header>
<main><!-- may pages component here</main>
<sidebar>...</sidebar>
<footer>...</footer>
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:43
   const page = Ractive.extend('Hola!');
   const mainLayout = Ractive.extend(' <pageholder />');
   const view = mainLayout.extend({
          components: { pageholder: page } 
    })
then isntance view.
last bit its totally modular
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:43
sidebar - some Ractive component too, maybe even header and footer too
you'll re-render all of this for each page?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:44
probably yes
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:45
for what purpose ?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:45
just yesterday i got some downsides of that
but
simplify pages
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:45
simplify ?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:45
you gonna write <header> <sidebar><footer> on every single page??
what if you need to alter that design?
if you have 100 pages
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:45
nope, I'll render it once
)))
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:46
true!
but
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:46
in App() component
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:46
not so modular
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:46
what do you mean?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:46
normally headers, sidebar and footers are not so heavy
and rerendering wont cause any burnt laptops
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:47
we don't know that
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:47
you do, if you design the site
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:47
also it's Ractive components and need to be included in every page you have?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:47
sameway you should know if you will have 1, 5, or 200 pages
you cant have same architecture for all those cases
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:47
Ok, for example, I write Webphotoshop
I have worksarea and really big header with many-many tools
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:48
yes
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:48
also I have side-bar with widgets or something
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:48
that's a case for a design more like the one you proposed
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:48
I don't want to re-render all that stuff on each route
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:48
true
but also
how many routes you will have?
probably not many
and not all of them will have the tools
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:49
maybe, but maybe not
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:49
just one , something like /editpicture/:pictureid:
even if id changes, you dont need to move things around
exactly, MAYBE
xD
so, depends on what you are designing
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:50
some weird restriction
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:50
I do mostly LOBs
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:51
I think, it's common issue, so seems it's doesn't matter what I'm designing
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:51
and its very common to start with 10 or so pages, but grow to hundreds
yes, its very common and thats why needs special care
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:51
if something not changing I don't need to re-render it on every route
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:51
no, but maybe its worth it
not in webphotoshop
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:52
exactly, MAYBE
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:52
but maybe i prefer to rerender in "websalesforce"
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:52
could you please provide any case of that?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:52
my case, its a good one
i have a mobile app
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:52
and?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:52
layout has only few design things
not so many html elements
but there are 60 pages, more or less
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:53
and why you need to re-render layout?
what profit?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:53
cos i prefered to use the layout component
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:54
?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:54
I dont need to
i chose to
i didnt care
there is almost zero cost
i prefer to teardown the whole component, and do a good lifecycle on each render
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:55
every render has a cost, especially on mobile
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:55
than mounting everything on one App component
then pages would be mounted on a ractive component
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:56
yes, I know that style, but it works only in very small apps.
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:56
and how can you control lifecycle there?
i need to teardown everypage before mounting a new one
cancel stuff
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:56
yep
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:57
and i just liked the way it looks
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:57
and what is the problem here?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:57
a variable with the current component
there is no problem
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:57
ok, I got it
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:57
im not complaning on my design
i take that variable and i can do stuff with it
i can pass messages, teardown
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:58
do you use any transition animation between pages?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:58
i can rerender on hotmodule replacement
yes i do
custom
small and fast
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:58
using Ractive transition plugin or not?
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:58
kind of fade with small movement
i dont remember exactly
dont have the code right now
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:59
seems not
Juan C. Andreu
@andreujuanc
Jan 29 2018 20:59
im on a road trip
Paul Maly
@PaulMaly_twitter
Jan 29 2018 20:59
ok, I got your vision of my first question
thanks!
how about second one? You have something inside you page:
<div>
    {{#if foo}}
    <div>
    {{#bar}}
    ...
    {{/bar}}
    </div>
    {{else}}
    <div>
    {{#baz}}
    ...
    {{/baz}}
    </div>
    {{/if}}
</div>
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:01
My vision is, simple code, clean and maintainable. nothing that looks like cypher xD
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:01
foo - user input/selection
bar and baz - data from server api
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:02
f(foo)
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:02

My vision is, simple code, clean and maintainable. nothing that looks like cypher xD

we all think so

Juan C. Andreu
@andreujuanc
Jan 29 2018 21:02
you can check foo
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:02
:smile:
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:02
validate
maybe not so performant
but its testable
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:02
i'm talking not about validation
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:03
then?
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:03
about data fetching
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:03
same
ah
once i did this
<div>
    {{#if foo}}
    {{goFetchTheDataPlox(foo)}}
    <div>
    {{#bar}}
    ...
    {{/bar}}
    </div>
    {{else}}
    <div>
    {{#baz}}
    ...
    {{/baz}}
    </div>
    {{/if}}
</div>
goFetchTheDataPlox would do both fetchs and then sets each section
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:04
foo - is just user input, true or false
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:04
goFetchTheDataPlox returns nothing
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:04
<input value="{{foo}}" type="checkbox">
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:05
once the checkbox is checked
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:05
so what purpose of that?
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:05
goFetchTheDataPlox gets alive and called right after checked
no need for observers xD
cos goFetchTheDataPlox wont be called until its rendered
I KNOW ITS UGLY
works
xD
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:06
ok, seems you understand my question right - how to make sure your data lazy-loads, because in some cases one of this conditions will never be rendered
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:07
in my example it will be called
right after foo is true
how to make sure
ITS LOADS
network conditions and so on?
i think its not UI concern
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:08
yep, but most of the people just pre-load all the data
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:08
i dont, or at least, not all the same
i do that "hack" on tabs
works nicely
when tab content is rendered i load the data
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:09
ok, I see your variant, thanks!
Juan C. Andreu
@andreujuanc
Jan 29 2018 21:09
you have bar and baz, and can have good old isLoading state
hope it helped
gonna go dinner
:beers:
Paul Maly
@PaulMaly_twitter
Jan 29 2018 21:18
Thanks, @andreujuanc
Any other ideas?