高擴展的在線網頁製做平臺-碼良正式開源

高擴展的在線網頁製做平臺-碼良使用介紹

在前一篇介紹瞭如何實現一個高擴展的在線網頁製做平臺，推薦先移駕到這裏查看如何設計高擴展的在線網頁製做平臺 這樣才知道是啥東西。前一篇文章也提到過咱們一直在計劃在合適的時候把項目放出來讓你們一塊兒用用，提提建議，通過接近1年的不斷迭代，以及在公司各個活動的挑戰下不斷優化，最終以爲是時候放出來了。目前仍是有不少要優化的地方，因此也但願使用者多提供反饋和關注。

1. 目前咱們提供了一個線上直接可使用體驗的版本 godspen.ymm56.com 能夠直接註冊體驗。
2. 一個能夠自行部署到本身服務器的docker版本 github.com/ymm-tech/go… 。

都歡迎你們體驗和反饋。以及加加 star 什麼的。後期的項目源碼咱們會放到這個項目。 歡迎你們提早star github.com/ymm-tech/go…

此次先爲你們來介紹下在碼良平臺如何去對一個組件進行功能擴展。此次咱們作個簡單的功能，拖動一個圖片，給圖篇添加點擊事件，而後在點擊事件裏面進行打點和頁面跳轉。

建立頁面添加腳本

你能夠先去 godspen.ymm56.com/doc/cookboo… 瞭解下項目裏面的團隊，項目，頁面各自的意思。這裏就當你已經看過。咱們建立好了一個頁面並進入了編輯界面以下。

咱們添加了一段demo2腳本以下，前面的文章咱們介紹過全部添加的腳本其實就是一個標準的vue 對象。對熟悉vue的同窗會很是容易理解和使用。

return {
  props: {
    // 這裏還能配置不少類型的屬性，能夠查看文檔 http://godspen.ymm56.com/doc/develop/script.html#%E6%B7%BB%E5%8A%A0%E8%87%AA%E5%AE%9A%E4%B9%89%E5%B1%9E%E6%80%A7
    url: {
      type: String,
      editor: {
        label: '網頁跳轉地址',
      }
    },
  },
  // 自定義方法的使用詳細文檔 http://godspen.ymm56.com/doc/develop/script.html#%E6%B7%BB%E5%8A%A0%E8%87%AA%E5%AE%9A%E4%B9%89%E6%96%B9%E6%B3%95
  editerMethods: {
    myjump:{
      label:'頁面跳轉',
      params:[]
    },
    logTrack: {
      label: '通用打點',
      params: [
        {
          label: '動做（action）',
          desc: '可輸入字母、數字、下劃線，用以區分打點動做，本頁面內需惟一，如 play_music',
          type: 'string'
        },
        {
          label: '標籤（label）',
          desc: '可輸入字母、數字、下劃線，用以表示動做的狀態、特徵、種類、結果等，如 classic_music',
          type: 'string'
        }
      ]
    }
  },
  methods: {
    async logTrack (action = '', label = '') {
      if (!action) return
      // 這裏你能夠進行打點，或者其餘的處理
      var Truck = this.$options.Truck
      var ESlog = Truck && Truck.ESlog
      await ESlog.track({
        page_id: this.$route.params && this.$route.params.pageKey || '',
        app_id: 'tview',
        action: action,
        label: label
      })
    },
    myjump(){
      window.location.href = this.url;
    }
  }
}
複製代碼

該腳本添加後就會在組件的屬性上多出一些可設置的屬性和可調用的方法方便再編輯器裏面選擇。

這樣你就爲一個簡單的圖片添加了點擊跳轉並打點的功能。 你能夠把你此次編輯的腳本保存爲模板腳本。爲其餘人提供使用。爲後面本身快速使用。

總結

此次比較初略的介紹了下碼良的腳本添加功能，須要總體瞭解功能和實現仍是推薦先閱讀第一篇設計介紹。本次主要的目的是告訴你們碼良這個項目開始對外提供服務和自行部署。也歡迎你們使用提建議。咱們會在過段時間進行源代碼開源。

問題諮詢聯繫方式：

釘釘羣

微信羣（二維碼可能會過時） 推薦添加上面的釘釘羣