Skip to content

Commit 518328d

Browse files
author
黄书伟
committed
doc update:
add copy add go jsfidder
1 parent 00b7d19 commit 518328d

File tree

13 files changed

+104
-25
lines changed

13 files changed

+104
-25
lines changed

‎examples/comp/Catalog.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@
9999
background-color: #fff;
100100
position: fixed;
101101
right: 0;
102-
top: 73px;
102+
top: 80px;
103103
border-radius: 3px;
104104
border: solid 1px #eee;
105105
font-size: 12px;

‎examples/comp/DemoBox.vue‎

Lines changed: 51 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,15 @@
1818
<div class="example-codeHighlight-tools" v-if="showCode">
1919
<i @click.stop="openJSFiddle()" title="在 JSFiddle 中打开"
2020
class="example-codeHighlight-tools-i iconfont icon-bug"></i>
21-
<!--<i title="复制代码" class="example-codeHighlight-tools-i iconfont icon-fuzhi"></i>-->
21+
<span>
22+
<i v-show="!copyDone" @click="copyCode" title="复制代码"
23+
class="copy-code example-codeHighlight-tools-i iconfont icon-fuzhi1"></i>
24+
25+
<i v-show="copyDone" class="copy-code-done iconfont icon-chenggong"
26+
@mouseout.stop="copyCodeMouseout($event)"></i>
27+
</span>
2228
</div>
29+
2330
<slot name="codeHighlight" v-if="showCode"></slot>
2431
<div class="example-codeHighlight-showCode" @click="showCodeToggle()">
2532
<i :class="[showCode?'v-icon-up-dir':'v-icon-down-dir']"></i>
@@ -32,7 +39,7 @@
3239
</template>
3340

3441
<script>
35-
42+
import Clipboard from 'clipboard'
3643
export default{
3744
name: 'demo-box',
3845
@@ -54,7 +61,8 @@
5461
5562
return {
5663
57-
showCode: false
64+
showCode: false,
65+
copyDone: false // copy done
5866
5967
}
6068
},
@@ -65,16 +73,53 @@
6573
6674
},
6775
76+
copyCode(){
77+
78+
let {html, style, script} = this.jsfiddle;
79+
80+
style = style ? '<style>' + style + '<\/style>\n' : '';
81+
82+
script = script ? '<script>' + script + '<\/script>' : '';
83+
84+
const code = (html || '') + style + script;
85+
86+
const clipboard = new Clipboard('.copy-code', {
87+
text(trigger) {
88+
return code;
89+
}
90+
});
91+
92+
93+
clipboard.on('success', (e) => {
94+
e.clearSelection();
95+
clipboard.destroy();
96+
97+
this.copyDone = true;
98+
});
99+
100+
clipboard.on('error', function (e) {
101+
console.error('Action:', e.action);
102+
console.error('Trigger:', e.trigger);
103+
});
104+
},
105+
106+
copyCodeMouseout(){
107+
108+
setTimeout(x=>{
109+
this.copyDone = false;
110+
},2000)
111+
},
112+
68113
openJSFiddle(){
69114
70115
const {script, html, style} = this.jsfiddle;
71116
72117
const scriptTpl = [
73-
'<script src="//unpkg.com/vue/dist/vue.js"></scr' + 'ipt>',
74-
'<script src="//unpkg.com/vue-easytable/umd/js/index.js"></scr' + 'ipt>',
118+
'<script src="//unpkg.com/vue/dist/vue.js"><\/script>',
119+
'<script src="//unpkg.com/vue-easytable/umd/js/index.js"><\/script>',
75120
].join('\n');
76121
77-
let jsTpl = (script || '').replace(/export default/, 'var Main =').replace(/import Vue from 'vue'/,'').trim();
122+
let jsTpl = (script || '').replace(/export default/, 'var Main =').replace(/import Vue from 'vue'/, '').trim();
78123
79124
jsTpl = jsTpl
80125
? jsTpl + '\nvar Ctor = Vue.extend(Main)\nnew Ctor().$mount(\'#app\')'

‎examples/css/index.css‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -640,14 +640,21 @@ code {
640640

641641
.example-codeHighlight-tools-i{
642642
margin-left: 10px;
643-
color:#8e8d8d;
643+
color:#7c9be0;
644644
cursor:pointer;
645645
font-size:16px;
646646

647647
}
648648

649+
.copy-code-done{
650+
margin-left: 10px;
651+
font-size:16px;
652+
color: #139a13;
653+
font-weight: bold;
654+
}
655+
649656
.example-codeHighlight-tools-i:hover{
650-
color:#34495e;
657+
color:#3561c3;
651658

652659
}
653660

‎examples/fonts/iconfont/demo_fontclass.html‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,9 @@ <h1>IconFont 图标</h1>
3131
</li>
3232

3333
<li>
34-
<i class="icon iconfont icon-fuzhi"></i>
34+
<i class="icon iconfont icon-fuzhi1"></i>
3535
<div class="name">复制</div>
36-
<div class="fontclass">.icon-fuzhi</div>
36+
<div class="fontclass">.icon-fuzhi1</div>
3737
</li>
3838

3939
<li>
@@ -48,6 +48,12 @@ <h1>IconFont 图标</h1>
4848
<div class="fontclass">.icon-gengxinrizhi</div>
4949
</li>
5050

51+
<li>
52+
<i class="icon iconfont icon-chenggong"></i>
53+
<div class="name">成功</div>
54+
<div class="fontclass">.icon-chenggong</div>
55+
</li>
56+
5157
<li>
5258
<i class="icon iconfont icon-shouqi1"></i>
5359
<div class="name">收起</div>

‎examples/fonts/iconfont/demo_symbol.html‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,10 +53,10 @@ <h1>IconFont 图标</h1>
5353

5454
<li>
5555
<svg class="icon" aria-hidden="true">
56-
<use xlink:href="#icon-fuzhi"></use>
56+
<use xlink:href="#icon-fuzhi1"></use>
5757
</svg>
5858
<div class="name">复制</div>
59-
<div class="fontclass">#icon-fuzhi</div>
59+
<div class="fontclass">#icon-fuzhi1</div>
6060
</li>
6161

6262
<li>
@@ -75,6 +75,14 @@ <h1>IconFont 图标</h1>
7575
<div class="fontclass">#icon-gengxinrizhi</div>
7676
</li>
7777

78+
<li>
79+
<svg class="icon" aria-hidden="true">
80+
<use xlink:href="#icon-chenggong"></use>
81+
</svg>
82+
<div class="name">成功</div>
83+
<div class="fontclass">#icon-chenggong</div>
84+
</li>
85+
7886
<li>
7987
<svg class="icon" aria-hidden="true">
8088
<use xlink:href="#icon-shouqi1"></use>

‎examples/fonts/iconfont/demo_unicode.html‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,9 +51,9 @@ <h1>IconFont 图标</h1>
5151
</li>
5252

5353
<li>
54-
<i class="icon iconfont">&#xe689;</i>
54+
<i class="icon iconfont">&#xe6d1;</i>
5555
<div class="name">复制</div>
56-
<div class="code">&amp;#xe689;</div>
56+
<div class="code">&amp;#xe6d1;</div>
5757
</li>
5858

5959
<li>
@@ -68,6 +68,12 @@ <h1>IconFont 图标</h1>
6868
<div class="code">&amp;#xe706;</div>
6969
</li>
7070

71+
<li>
72+
<i class="icon iconfont">&#xe661;</i>
73+
<div class="name">成功</div>
74+
<div class="code">&amp;#xe661;</div>
75+
</li>
76+
7177
<li>
7278
<i class="icon iconfont">&#xe746;</i>
7379
<div class="name">收起</div>

‎examples/fonts/iconfont/iconfont.css‎

Lines changed: 8 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/fonts/iconfont/iconfont.eot‎

80 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)