sublime text 3 ，React，html元素自动补全方法（用Emmet写法写jsx中的html）

1. 安装emmet: Preferences -> Package Control -> Install Package -> emmet

2. 配置emmet： Preferences -> Package Settings -> Emmet -> Key Bindings - User

　将下方的代码贴到打开的文件中，然后就可以使用tab键对render中的（部分）html元素使用自动补全功能了

 [
     {
         "keys": [
             "super+e"
         ],
         "args": {
             "action": "expand_abbreviation"
         },
         "command": "run_emmet_action",
         "context": [
             {
                 "key": "emmet_action_enabled.expand_abbreviation"
             }
         ]
     },
     {
         "keys": [
             "tab"
         ],
         "command": "expand_abbreviation_by_tab",
         "context": [
             {
                 "operand": "source.js",
                 "operator": "equal",
                 "match_all": true,
                 "key": "selector"
             },
             {
                 "key": "preceding_text",
                 "operator": "regex_contains",
                 "operand": "(\\b(a\\b|div|span|p\\b|button)(\\.\\w*|>\\w*)?([^}]*?}$)?)",
                 "match_all": true
             },
             {
                 "key": "selection_empty",
                 "operator": "equal",
                 "operand": true,
                 "match_all": true
             }
         ]
     }
 ]

补充：

　　在贴了上述代码之后，只有部分标签用tab键能够自动补全，但是还有很多标签只能用ctrl+e补全，比如h1,Route等，经查阅，将上述代码替换为下面的代码，则能解决这个问题

 [{
     "keys": ["tab"],
     "command": "expand_abbreviation_by_tab",

     // put comma-separated syntax selectors for which
     // you want to expandEmmet abbreviations into "operand" key
     // instead of SCOPE_SELECTOR.
     // Examples: source.js, text.html - source
     "context": [{
             "operand": "source.js",
             "operator": "equal",
             "match_all": true,
             "key": "selector"
         },

         // run only if there's no selected text
         {
             "match_all": true,
             "key": "selection_empty"
         },

         // don't work if there are active tabstops
         {
             "operator": "equal",
             "operand": false,
             "match_all": true,
             "key": "has_next_field"
         },

         // don't work if completion popup is visible and you
         // want to insert completion with Tab. If you want to
         // expand Emmet with Tab even if popup is visible --
         // remove this section
         {
             "operand": false,
             "operator": "equal",
             "match_all": true,
             "key": "auto_complete_visible"
         }, {
             "match_all": true,
             "key": "is_abbreviation"
         }
     ]
 }]