Comments (3)
If you want to use click events server-side, you definitely can, but you'll need to explicitly trigger them. There's no mouse to do the clicking otherwise. Check out https://tonicdev.com/57867105c8bce912001b80e0/57974db8e7195a1200952a76 for an example, where I'm triggering the click manually. You can do this from inside this component, or from any other component (calling document.querySelector("demo-component").click()
for example) to make components that work together.
Or is it that you're expecting the click handler to be registered and working when the page loads on the client side? Server components is just a tool for building HTML; in-memory state of the HTML (such as registered event handlers) can't be carried across between the server and the client. If you want that, you'll want to register the element client and server side, and render it on both. https://github.com/pimterry/leaflet-map-server-component/blob/master/src/leaflet-map.js is an example of this (though it's a little complicated).
Does that make sense?
from server-components.
Yes, i was think server components to be more like a full fledged web-component whose html can be built on the serverside but the events would register on the client side. I guess I got my answer for now.
Thanks for the answer
from server-components.
Ok, sure! Yes, take a look at the leaflet-map example above to see that in action.
You can do that as there with just one file, probably using UMD as there so you can load the same file easily everywhere. Alternatively you can have write two component definitions, one that does server-side rendering (setting 'color: blue' in your example), and one that adds event handlers for later changes, and use the first server-side and the 2nd client-side.
Which is best for you most depends on whether you need to repeat the initial rendering steps later: if you do need to re-render from scratch client-side you'll usually want to share the code completely between the client and server, but if not you can keep all the rendering server-side, and just add extra interactivity separately.
Good luck! Let me know if you have other questions.
from server-components.
Related Issues (20)
- Allow rendering of fragments
- Support type extension elements HOT 1
- Document the exact differences with real web components HOT 2
- Come up with easy standard patterns for component registration (components.use(require('my-component')))
- Make it easy to integrate server components and templating libraries like Mustache for data HOT 1
- Make it easy to integrate with Express
- Design an approach to isometric component support HOT 4
- Make example code from README runnable, with TonicDev or similar HOT 2
- Create a standalone example express project
- Put together an ascii cinema setup demo
- Add MutationObserver to Domino
- Move to wrapping a standard custom elements polyfill HOT 1
- Move website onto DNS.js.org
- Build a TODO MVC style demo app
- Example with ES6 imports HOT 2
- Convert to Custom Elements spec V1 HOT 3
- Is this project abandoned? HOT 2
- template support HOT 1
- data binding, ex: table
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 server-components.