Skip to content

Instantly share code, notes, and snippets.

@edwardwbli
Last active January 10, 2017 06:37
Show Gist options
  • Save edwardwbli/8744a2e545f1780c95db6e57df74f227 to your computer and use it in GitHub Desktop.
Save edwardwbli/8744a2e545f1780c95db6e57df74f227 to your computer and use it in GitHub Desktop.
this a example for using createElement in react.
<!DOCTYPE html>
<html>
<head>
<title>ToDo</title>
<script src="https://cdn.rawgit.com/amark/gun/master/gun.js"></script>
<script src="https://unpkg.com/react@15.3.2/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.3.2/dist/react-dom.js"></script>
<style media="screen" type="text/css">
.todocontent, .inprogresscontent {
float: left;
position: relative;
left: 20%;
margin-left: 10px;
}
h1 {
margin-left: 20%;
}
li {
color: red;
font-weight: bolder;
}
span {
}
</style>
</head>
<body>
<div class="todocontent">
<h1>Todos</h1>
<div id="todo"></div>
</div>
<script>
"use strict";
var del = function () {
alert("del item");
};
var todoElem = React.createClass({
getInitialState(){ return {items: {}} },
render(){
var link = React.createElement('a', {href: '#'}, "list 1",React.createElement('span',{id: 'delete', onClick: del }, " D"))
return link
}
});
ReactDOM.render(React.createElement(todoElem, {}),
document.getElementById('todo'));
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment