12345678910111213141516171819202122232425262728293031323334353637383940414243 |
- <template>
- <details class="custom-block details custom-code">
- <summary>查看源代码:{{ fileUrl }}</summary>
- <pre class="line-numbers">
- <code class="language-typescript" v-html="code"></code>
- </pre>
- </details>
- </template>
- <script lang="ts">
- import axios from "axios"
- import { Component, Prop, Vue } from "vue-property-decorator";
- @Component
- export default class GitCode extends Vue {
- @Prop() private project: string = '/web/persagy-web';
- @Prop() private raw: string = '/raw/master';
- @Prop() private fileUrl: string = '/persagy-web-big/src/items/SIconTextItem.ts';
- @Prop() private type: string = 'typescript';
- baseUrl: string = '/git';
- code: string = '';
- created() {
- this.init()
- };
- get requestUrl(){
- return this.baseUrl + this.project + this.raw + this.fileUrl;
- };
- init(){
- axios({
- method: "get",
- url: this.requestUrl
- }).then(res => {
- this.code = res.data;
- this.$nextTick(()=>{
- // 此处选择器 只选择当前组件的pre code,否则影响组件外 代码区域 格式
- document.querySelectorAll(".custom-code pre code").forEach(block => {
- // @ts-ignore
- Prism.highlightElement(block)
- });
- });
- })
- }
- }
- </script>
|