From e66aaf1458c97ef18d2a18a0fef6b2325c46debb Mon Sep 17 00:00:00 2001
From: Per Eriksson <per@interapp.se>
Date: Tue, 25 Jan 2022 21:43:03 +0100
Subject: [PATCH] A note on JSX events (#2648)

Co-authored-by: Stephan Hoyer <ste.hoyer@gmail.com>
---
 docs/jsx.md | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/docs/jsx.md b/docs/jsx.md
index be58e3c3..38933927 100644
--- a/docs/jsx.md
+++ b/docs/jsx.md
@@ -2,8 +2,10 @@
 
 - [Description](#description)
 - [Setup](#setup)
+- [Production build](#production-build)
 - [Using Babel with Webpack](#using-babel-with-webpack)
 - [JSX vs hyperscript](#jsx-vs-hyperscript)
+- [A note on event listeners](#a-note-on-event-listeners)
 - [Converting HTML](#converting-html)
 
 ---
@@ -23,6 +25,7 @@ function MyComponent() {
 }
 
 // can be written as:
+
 function MyComponent() {
 	return {
 		view: () => (
@@ -338,6 +341,24 @@ function SummaryView() {
 
 ---
 
+### A note on event listeners
+
+While JSX events are usually named using camelCase, lowercase names should be used when JSX is used with Mithril.
+
+```jsx
+m("main", [
+	m("input", { type: "text", oninput: ... }),
+	m("input", { type: "button", value: "Click me", onclick: ... })
+])
+
+// can be written as:
+
+<main>
+    <input type="text" oninput={...}/>
+    <input type="button" value="Click me" onclick={...}/>
+</main>
+```
+
 ### Converting HTML
 
 In Mithril, well-formed HTML is generally valid JSX. Little more than just pasting raw HTML is required for things to just work. About the only things you'd normally have to do are change unquoted property values like `attr=value` to `attr="value"` and change void elements like `<input>` to `<input />`, this being due to JSX being based on XML and not HTML.