<script> import axios from 'axios'; const carbonUrls = { 'vuecomponent.github.io': '//cdn.carbonads.com/carbon.js?serve=CK7DL2JW&placement=vuecomponentgithubio', 'tangjinzhou.gitee.io':'//cdn.carbonads.com/carbon.js?serve=CK7DL2JN&placement=tangjinzhougiteeio', 'ant-design-vue.gitee.io':'//cdn.carbonads.com/carbon.js?serve=CK7DL2JN&placement=antdesignvuegiteeio', 'vue.ant.design': '//cdn.carbonads.com/carbon.js?serve=CK7DL2JW&placement=vueantdesign', }; const carbonUrl = carbonUrls[location.host] || '//cdn.carbonads.com/carbon.js?serve=CK7DL2JW&placement=vuecomponentgithubio'; export default { props: { isMobile: Boolean, }, watch: { $route(e, t) { let adId = '#carbonads'; // if(isGitee) { // adId = '#cf'; // } if(e.path !== t.path && this.$el.querySelector(adId)){ this.$el.innerHTML = ""; this.load(); } this.adInterval && clearInterval(this.adInterval); this.adInterval = setInterval(()=>{ if(!this.$el.querySelector(adId)){ this.$el.innerHTML = ""; this.load(); } }, 20000); }, }, mounted() { this.load(); }, methods: { load() { // if(isGitee) { // axios.get('https://api.codefund.app/properties/162/funder.html?template=horizontal') // .then(function (response) { // document.getElementById("codefund-ads").innerHTML = response.data; // }); // } else if(carbonUrl) { const e = document.createElement("script"); e.id = "_carbonads_js"; e.src = carbonUrl; this.$el.appendChild(e); } }, }, render () { return ( <div id="carbon-ads" class={this.isMobile ? 'carbon-mobile':''}/> ); }, }; </script> <style lang="less"> #carbon-ads { overflow: hidden; width: 145px; position: fixed; z-index: 9; bottom: 10px; right: 10px; padding: 10px; background-color: #fff; border-radius: 3px; font-size: 13px; background: #f5f5f5; font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif; } #carbon-ads a { display: inline-block; color: #7f8c8d; font-weight: normal; } #carbon-ads span { color: #7f8c8d; } #carbon-ads img { width: 125px; } #carbon-ads .carbon-img, #carbon-ads .carbon-text { display: block; font-weight: normal; color: #34495e; } #carbon-ads .carbon-text { margin-top: 6px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } #carbon-ads .carbon-poweredby { color: #aaa ; font-weight: normal ; line-height: 1.2 ; margin-top: 6px; } #carbon-ads.carbon-mobile { width: 100%; position: relative; right: 0; bottom: 0; padding: 0; .carbon-img { float: left; margin-right: 10px; } } </style>