Comments (6)
@mindplay-dk Can you show the code with the current result body and the result you want?
from superfine.
Uhm, well, let's say I have a static page with some kind of layout.
<body>
<div class="header">.....</div>
<div id="fancy_app"></div>
<div class="footer">.....</div>
</body>
And then something like:
import { patch, h } from "picodom";
function view() {
return
<div class="woot">
<h1>Boom!</h1>
</div>
}
patch(document.getElementById("fancy_app", {}, view());
Now I end up with:
<body>
<div class="header">.....</div>
<div id="fancy_app">
<div class="woot">
<h1>Boom!</h1>
</div>
</div>
<div class="footer">.....</div>
</body>
So now, the top-level node of the actual view is div.woot
, but it's wrapped in div#fancy_app
- one of those two would have likely been enough, but... I guess JSX syntax forces you to always return a single parent node, and you have to have another reserved node to render into, whether that's body
or something else...
I don't know, maybe it's no big deal? I only brought it up because hyperHTML, using template strings, allowed me to render multiple nodes into a target container - but I guess maybe the limitation here is actually JSX syntax itself?
from superfine.
@mindplay-dk Okay, I understand now. Picodom doesn't have the ability to return an array of elements in the top level container, but component can return arrays of elements.
However, there is currently no way to tell Picodom to replace the given container and if there was, what would happen when you pass document.body
?
from superfine.
Good point about the document body, yeah, that wouldn't even make any sense.
In my mind, I'm trying to turn this into a good thing - the fact that every view or component has precisely one root node actually makes the whole app (and framework) much simpler and easier to reason about. Maybe "fixing" this isn't even a good idea?
from superfine.
@mindplay-dk This is one of the reasons the container was optional. So, that default behavior would be append to document.body without wrapper elements.
from superfine.
I think there's nothing actionable here, so I'm closing this issue.
from superfine.
Related Issues (20)
- Is using custom `events` property for DOM element really future proof? HOT 3
- Is superfine a shared core of both hyperapp v1/v2 ? HOT 6
- Reference from a new virtual DOM framework project based on superfine HOT 2
- Is there any way superfine JSX/HyperScript code work on iOS/Android natively like React-Native? HOT 2
- This again: stateful components? ๐คจ HOT 16
- if-else case caused every element update HOT 1
- Lifecycle Events HOT 35
- Missing superfine.d.ts HOT 2
- Is v6 officialy depredated? HOT 2
- Usage of Props HOT 7
- V7 and Document Fragments HOT 20
- patch doesn't replace id of target node HOT 2
- node.setAttribute is not a function HOT 9
- Lifecycle events using Mutation Observer HOT 1
- Minimum example of a table with some sorting HOT 5
- Potential bug when recycling nested elements HOT 1
- Support for React-like `ref`s? HOT 23
- element handlers don't work on root nodes HOT 1
- I create a minimalistic component based framework on the top of superfine HOT 1
- Discussion about patching shadow-root nodes? Feature request?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from superfine.