Last active
January 10, 2017 06:37
-
-
Save edwardwbli/8744a2e545f1780c95db6e57df74f227 to your computer and use it in GitHub Desktop.
this a example for using createElement in react.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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