forked from maple3142/vue-runkit
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexample.html
47 lines (47 loc) · 1.34 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE HTML>
<html>
<head>
<title>vue-runkit Example</title>
<!-- This example should be served by a web server (Python 2: "python -m SimpleHTTPServer") -->
<meta charset="utf-8"></meta>
<!-- <script src="https://embed.runkit.com"></script>
if window.RunKit not appear
script will auto add it-->
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-runkit"></script>
<!-- <script src="dist/vue-runkit.js"></script> for local version -->
<!-- <script src="https://unpkg.com/vue-runkit/dist/vue-runkit.min.js"></script> for production version-->
</head>
<body>
<div id="app">
<runkit
@onLoad="onLoad"
@onEvaluate="onEvaluate"
source="`Env: ${process.env.test}, preambleVar: ${preambleVar}` // Run me"
:env="['test=123']"
node-version="8.3.0"
preamble="var preambleVar = 'It works'"
min-height="300px"
ref="runkit">
</runkit>
</div>
<script>
Vue.component('runkit',window.vuerunkit)
var app=new Vue({
el: '#app',
methods: {
onLoad: function(nt){
console.log('notebook loaded')
console.log(nt)
},
onEvaluate: function(){
//notebook instance can be access from this.$refs.runkit.notebook
this.$refs.runkit.notebook.getSource(function(src){
console.log(src)
})
}
}
})
</script>
</body>
</html>