* Initialize vue
// ******************** js part ******** Ideas were; window.onload=function(){ The nitVue (); }; function initVue(){ app = new view ({ el: '#app', // the id of the corresponding html app data: { }, methods: { }, watch: { }, }) }
<-! Html part -> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge ;chrome=1"/> <title>xxx</title> <! - introduced elment related js and css -> <link rel="stylesheet" type="text/css" href="../../assets/element-ui/lib/theme-chalk/index.css"/> <script src="../../assets/element-ui/pack.js"></script> <script src="../../assets/element-ui/lib/addons.js"></script> <script src="js/archiveManager.js"></script> </head> <body> <! - id and consistent here in js -> <div id="app"> </div> </body> </html>
* .Elemnt single box label incoming background values, where the displayed page "Yes / No" is passed back to 'Y / N'
<El-form-item label = "whether to approve the" prop = "checkFlag"> <el-radio-group v-model="archiveSelect.checkFlag"> <el-radio label="Y">是</el-radio> <el-radio label="N">否</el-radio> </el-radio-group> </el-form-item>
* Form a custom display, scope.row for all data of the current line
<El-table-column label = "Data a"> <template slot-scope="scope"> <Div> Archive: <el-link type="success" @click="toArchive(scope.row.busino,archiveType.archiveOneNo)">{{formatArchiveType(scope.row,'archiveOneNo')}}</el-link> </div> </template> </el-table-column>
*. Vue property or method call in any sheet, above the reference {} is called by the upper graph formatArchiveType a method of vue
* Splicing value of the property value string and back stitching, used here is the href, quoted string sound, background splicing parameters Number +
<el-link type="primary" :underline="false" :href="'viewFile.html?busino='+selectBusino+'&fileType='+archiveSelect.fileTypeCode" target = "_ blank"> View Photo </ el-link>
* Add the parameters for the background object properties, mainly for the initial non-existent property, but have to be used in html, this way the html to take effect, here's app refer to the first initialization vue.
. App $ set (app.archiveSelect, "archiveNum", ret.archiveNum); // add archiveNum property chiveSelect