Vscode snippet variable

问题

"snippet with class binding":{
    "prefix": "row.${variable}",
    "body":[
        "<table class=\"row ${same_variable_here}\">",
        "\t<tr>",
        "\t\t<td>",
        "\t\t\t$0",
        "\t\t</td>",
        "\t</tr>",
        "</table>"
    ]
}

Is it possible(and how if so) to create variables like some_entity.classname expanding into something like this(in html for example):

<div class="classname"></div>

回答1:

It looks like you have two questions there. Yes, emmet expansion will automatically turn div.myClass into <div class="myClass"></div>. See emmet in vscode.

Your other question is about a emmet snippet for a full table expansion. See custom emmet snippets. In your settings.json you will need:

  "emmet.extensionsPath": "C:\\Users\\Mark\\.vscode\\extensions"

That should point to a folder that contains a new file that you will create called snippets.json. In that file put:

{
  "html": {
    "snippets": {
        "tableR": 
          "table.row.$1>tr>td"
    }
  }
}

Use whatever prefix you want besides "tableR". Then you must reload vscode. Then type your prefix and tab to expand (assuming you have the emmet tab expansion setting in your settings.]

[EDIT]: Based on your comment below, perhaps you are looking for something as simple as a snippet with a keybinding:

{
    "key": "ctrl+alt+n",
    "command": "editor.action.insertSnippet",
    "when": "editorTextFocus",
    "args": {
      "snippet": "${TM_SELECTED_TEXT/(.*)\\.(.*)/<$1 class=\"$2\"><\\/$1>/}"
    }
},

So if you select anyTag.someClass becomes <anyTag class="someClass"></anyTag> when you use whatever keybinding you have chosen. Emmet is not involved here, this is just a simple keybinding in your keybindings.json (you can limit it to certain languages if you wish). Emmet expansion does not allow you to transform its prefix (the regexp above) the way a plain snippet can grab the selection or current word and transform it.

来源：https://stackoverflow.com/questions/51856237/vscode-snippet-variable