unique-interface
Version:
无UI组件库
69 lines (64 loc) • 1.74 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>设计规范</title>
<link rel="stylesheet" href="//at.alicdn.com/t/font_548064_64b1sngv4e.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_986593_qv4lraswik.css">
<style>
body { margin: 0; padding: 20px; font-size: 14px; line-height: 24px; }
.script-name {
display: block;
width: 200px;
padding: 5px 10px;
border: 1px solid #ddd;
cursor: pointer;
}
</style>
</head>
<body>
<div id="root">
<div>
<p style="margin: 0 0 10px;">选择测试脚本：</p>
<div @change="navigate">
<label class="script-name" v-for="script in scripts">
<input type="radio" v-model="scriptName" :value="script">
<span>{{ script }}</span>
</label>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el: "#root",
data: {
scriptName: '',
scripts: ['test', 'faas-ui']
},
created: function(){
var searchArr = location.search.slice(1).split('&'),
searchObj = {};
searchArr.forEach(function(item) {
var itemArr = item.split('=');
searchObj[itemArr[0]] = itemArr[1];
});
if(searchObj.script){
this.scriptName = searchObj.script;
this.useScript();
}
},
methods: {
navigate: function() {
location.search = 'script=' + this.scriptName;
},
useScript: function(){
var s = document.createElement('script');
s.src = './dist/' + this.scriptName + '.js';
document.body.appendChild(s);
}
},
});
</script>
</body>
</html>