AmpersandJS 代码片段

由 HSH 全部

Sublime Text 代码片段，用于 AmpersandJS

详细信息

版本 1.1.0
主页 ampersandjs.com
问题 github.com
修改日期 7年前
上次查看 23分钟前
首次看到 8年前

安装数

总计 632
Win 490
Mac 83
Linux 59

	8月6日	8月5日	8月4日	8月3日	8月2日	8月1日	7月31日	7月30日	7月29日	7月28日	7月27日	7月26日	7月25日	7月24日	7月23日	7月22日	7月21日	7月20日	7月19日	7月18日	7月17日	7月16日	7月15日	7月14日	7月13日	7月12日	7月11日	7月10日	7月9日	7月8日	7月7日	7月6日	7月5日	7月4日	7月3日	7月2日	7月1日	6月30日	6月29日	6月28日	6月27日	6月26日	6月25日	6月24日	6月23日
Windows	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	1	0	0	0	1	0	0	0	0	0	0	0	0	0	0	0
Mac	1	1	0	0	0	0	0	0	1	0	0	0	1	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0
Linux	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0	0

说明

源代码: raw.githubusercontent.com

AmpersandJS 代码片段

代码片段用于快速创建更好的 AmpersandJS JavaScript 应用程序。

安装

使用 Sublime Text 的包管理器安装此插件。

手动安装

打开 Terminal.app 并执行以下命令

Sublime Text 2

cd ~/Library/"Application Support"/"Sublime Text 2"/Packages/
git clone [email protected]:HSH/AmpersandJS-Sublime-Text-Snippets.git

Sublime Text 3

cd ~/Library/"Application Support"/"Sublime Text 3"/Packages/
git clone [email protected]:HSH/AmpersandJS-Sublime-Text-Snippets.git

代码片段

要使用片段，输入触发代码（如下粗体所示），然后按 tab 或 ctrl + enter。注意，您可以通过按 tab / shift + tab 快速在代码的不同部分之间导航。

Ampersand initialize 函数

触发器： initialize

<snippet>
  <content><![CDATA[
initialize: function (${1:opts}) {
  var ${2:self} = this
},
]]></content>
  <tabTrigger>initialize</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Ampersand initialize function</description>
</snippet>

通用的 Ampersand-State 扩展

触发器： ampersandState

<snippet>
  <content><![CDATA[
var AmpersandModel = require('ampersand-state')

module.exports = AmpersandModel.extend({
  extraProperties: ${1:'ignore'},
  props: {
    ${2:}
  },
  session: {
    ${3:}
  },
  derived: {
    ${4:}
  }
})
]]></content>
  <tabTrigger>ampersandState</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Ampersand State</description>
</snippet>

Ampersand derived property 定义

触发器： deps

<snippet>
  <content><![CDATA[
deps: ['${1:property}'],
fn: function () {
  ${2:}
},
cache: ${3:true}
]]></content>
  <tabTrigger>deps</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>derived property</description>
</snippet>

Ampersand props property 定义

触发器： prop

<snippet>
  <content><![CDATA[
${1:prop}: {
  type: '${2:string}',
  required: ${3:true},
  default: '${4:}', 
  values: ['${5:}'],
  allowNull: ${6:false},
  setOnce: ${7:false}
}
]]></content>
  <tabTrigger>prop</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>State props property</description>
</snippet>

通用的 Ampersand-Model 扩展

触发器： ampersandModel

<snippet>
  <content><![CDATA[
var AmpersandModel = require('ampersand-model')

module.exports = AmpersandModel.extend({
  ajaxConfig: function () {
    var model = this
    return {
      headers: {

      },
      xhrFields: {

      }
    }
  },
  url: function () {
    var model = this

    return model.urlRoot
  },
  urlRoot: '',
  props: {},
  session: {},
  derived: {}
})
]]></content>
  <tabTrigger>ampersandModel</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Ampersand Model</description>
</snippet>

通用的 Ampersand-Rest-Collection 扩展

触发器： ampersandCollection

<snippet>
  <content><![CDATA[
var AmpersandRestCollection = require('ampersand-rest-collection')
var ${1:Model} = require('${2:../models/${3:}}')

module.exports = AmpersandRestCollection.extend({
  model: ${1:Model},
  mainIndex: '${4:_id}',
  url: '${5:}'
})

]]></content>
  <tabTrigger>ampersandCollection</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Ampersand REST Collection</description>
</snippet>

通用的 Ampersand-View 扩展

触发器： ampersandView

<snippet>
  <content><![CDATA[
var AmpersandView = require('ampersand-view')

module.exports = AmpersandView.extend({
  template: function () {},
  events: {

  },
  bindings: {

  }
})

]]></content>
  <tabTrigger>ampersandView</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Ampersand View</description>
</snippet>

简单的 Ampersand bindings 声明

触发器： model.

<snippet>
  <content><![CDATA[
'model.${1:name}': {
  type: '${2:text}',
  selector: '${3:[data-hook="${4:name}"]}'
}
]]></content>
  <tabTrigger>model.</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>model binding property</description>
</snippet>

registerSubview 函数

触发器： registerSubview

<snippet>
  <content><![CDATA[
view.registerSubview(${1:viewInstance})
]]></content>
  <tabTrigger>registerSubview</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>registerSubview function</description>
</snippet>

render 函数

触发器： render

<snippet>
  <content><![CDATA[
render: function (${1:opts}) {
  var view = this
  ${2:view._upsertBindings()}
  ${3:view.renderWithTemplate(view)}
  ${4:}
  return view
}
]]></content>
  <tabTrigger>render</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>render function</description>
</snippet>

renderCollection 函数

触发器： renderCollection

<snippet>
  <content><![CDATA[
view.renderCollection(${1:collection}, ${2:ItemView}, ${3:containerEl}${4:, ${5:viewOptions}})
]]></content>
  <tabTrigger>renderCollection</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>renderCollection function</description>
</snippet>

renderSubview 函数

触发器： renderSubview

<snippet>
  <content><![CDATA[
view.renderSubview(${1:viewInstance}, ${2:containerEl})
]]></content>
  <tabTrigger>renderSubview</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>renderSubview function</description>
</snippet>

renderWithTemplate 函数

触发器： renderWithTemplate

<snippet>
  <content><![CDATA[
view.renderWithTemplate(${1:view}, ${2:view.template})
]]></content>
  <tabTrigger>renderWithTemplate</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>renderWithTemplate function</description>
</snippet>

subviews 定义

触发器： subviews

<snippet>
  <content><![CDATA[
subviews: {
  ${1:myStuff}: {
    selector: '${2:[data-hook=collection-container]}',
    waitFor: 'model.${3:stuffCollection}',
    prepareView: function (el) {
      return new ${4:CollectionRenderer}({
        el: el,
        collection: this.model.${3:stuffCollection}
      })
    }
  }
}
]]></content>
  <tabTrigger>subviews</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>subviews definition property</description>
</snippet>

保存模型定义

触发器： 保存

<snippet>
  <content><![CDATA[
save(${1:view.model}, {
  success: function (model, response, options) {

  },
  error: function (model, response, options) {

  }
})
]]></content>
  <tabTrigger>save</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Save Ampersand Model</description>
</snippet>

获取模型定义

触发器： 获取

<snippet>
  <content><![CDATA[
fetch({
  success: function (model, response, options) {

  },
  error: function (model, response, options) {

  }
})
]]></content>
  <tabTrigger>fetch</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Fetch Ampersand Model</description>
</snippet>

销毁模型定义

触发器： 销毁

<snippet>
  <content><![CDATA[
destroy({
  success: function (model, response, options) {

  },
  error: function (model, response, options) {

  }
})
]]></content>
  <tabTrigger>destroy</tabTrigger>
  <scope>source.js, source.jsx, source.ts</scope>
  <description>Destroy Ampersand Model</description>
</snippet>

AmpersandJS 代码片段

详细信息

安装数

说明

AmpersandJS 代码片段

安装

手动安装

Sublime Text 2

Sublime Text 3

代码片段

Ampersand initialize 函数

通用的 Ampersand-State 扩展

Ampersand derived property 定义

Ampersand props property 定义

通用的 Ampersand-Model 扩展

通用的 Ampersand-Rest-Collection 扩展

通用的 Ampersand-View 扩展

简单的 Ampersand bindings 声明

registerSubview 函数

render 函数

renderCollection 函数

renderSubview 函数

renderWithTemplate 函数

subviews 定义

保存模型 定义

获取模型 定义

销毁模型 定义

保存模型定义

获取模型定义

销毁模型定义