fix #29

fix title to interpolate html

README.md

@@ -10,6 +10,15 @@
 ``` bash
     npm install vue-upload-component --save
 ```
+### Vue 2.x
+
+https://github.com/lian-yue/vue-upload-component/tree/2.0
+
+``` bash
+    npm install vue-upload-component@next --save
+```
+
+
 ### CommonJS
 ```js
     var FileUpload = require('vue-upload-component');

dist/vue-upload-component.js

@@ -180,12 +180,12 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 11 */
 /***/ function(module, exports, __webpack_require__) {
 
-	// 19.1.2.14 / 15.2.3.14 Object.keys(O)
+	// 19.1.2.14 / 15.2.3.14 Object.keys(O)
-	var $keys       = __webpack_require__(35)
+	var $keys       = __webpack_require__(35)
-	  , enumBugKeys = __webpack_require__(16);
+	  , enumBugKeys = __webpack_require__(16);
-	
+	
-	module.exports = Object.keys || function keys(O){
+	module.exports = Object.keys || function keys(O){
-	  return $keys(O, enumBugKeys);
+	  return $keys(O, enumBugKeys);
 	};
 
 /***/ },
@@ -232,9 +232,9 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 16 */
 /***/ function(module, exports) {
 
-	// IE 8- don't enum bug keys
+	// IE 8- don't enum bug keys
-	module.exports = (
+	module.exports = (
-	  'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf'
+	  'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf'
 	).split(',');
 
 /***/ },
@@ -271,10 +271,10 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 21 */
 /***/ function(module, exports, __webpack_require__) {
 
-	var shared = __webpack_require__(22)('keys')
+	var shared = __webpack_require__(22)('keys')
-	  , uid    = __webpack_require__(13);
+	  , uid    = __webpack_require__(13);
-	module.exports = function(key){
+	module.exports = function(key){
-	  return shared[key] || (shared[key] = uid(key));
+	  return shared[key] || (shared[key] = uid(key));
 	};
 
 /***/ },
@@ -320,14 +320,14 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 25 */
 /***/ function(module, exports, __webpack_require__) {
 
-	var global         = __webpack_require__(1)
+	var global         = __webpack_require__(1)
-	  , core           = __webpack_require__(14)
+	  , core           = __webpack_require__(14)
-	  , LIBRARY        = __webpack_require__(18)
+	  , LIBRARY        = __webpack_require__(18)
-	  , wksExt         = __webpack_require__(26)
+	  , wksExt         = __webpack_require__(26)
-	  , defineProperty = __webpack_require__(6).f;
+	  , defineProperty = __webpack_require__(6).f;
-	module.exports = function(name){
+	module.exports = function(name){
-	  var $Symbol = core.Symbol || (core.Symbol = LIBRARY ? {} : global.Symbol || {});
+	  var $Symbol = core.Symbol || (core.Symbol = LIBRARY ? {} : global.Symbol || {});
-	  if(name.charAt(0) != '_' && !(name in $Symbol))defineProperty($Symbol, name, {value: wksExt.f(name)});
+	  if(name.charAt(0) != '_' && !(name in $Symbol))defineProperty($Symbol, name, {value: wksExt.f(name)});
 	};
 
 /***/ },
@@ -428,8 +428,8 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 30 */
 /***/ function(module, exports, __webpack_require__) {
 
-	module.exports = !__webpack_require__(4) && !__webpack_require__(9)(function(){
+	module.exports = !__webpack_require__(4) && !__webpack_require__(9)(function(){
-	  return Object.defineProperty(__webpack_require__(28)('div'), 'a', {get: function(){ return 7; }}).a != 7;
+	  return Object.defineProperty(__webpack_require__(28)('div'), 'a', {get: function(){ return 7; }}).a != 7;
 	});
 
 /***/ },
@@ -511,57 +511,59 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 32 */
 /***/ function(module, exports, __webpack_require__) {
 
-	// 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties])
+	// 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties])
-	var anObject    = __webpack_require__(8)
+	var anObject    = __webpack_require__(8)
-	  , dPs         = __webpack_require__(55)
+	  , dPs         = __webpack_require__(55)
-	  , enumBugKeys = __webpack_require__(16)
+	  , enumBugKeys = __webpack_require__(16)
-	  , IE_PROTO    = __webpack_require__(21)('IE_PROTO')
+	  , IE_PROTO    = __webpack_require__(21)('IE_PROTO')
-	  , Empty       = function(){ /* empty */ }
+	  , Empty       = function(){ /* empty */ }
-	  , PROTOTYPE   = 'prototype';
+	  , PROTOTYPE   = 'prototype';
-	
+	
-	// Create object with fake `null` prototype: use iframe Object with cleared prototype
+	// Create object with fake `null` prototype: use iframe Object with cleared prototype
-	var createDict = function(){
+	var createDict = function(){
-	  // Thrash, waste and sodomy: IE GC bug
+	  // Thrash, waste and sodomy: IE GC bug
-	  var iframe = __webpack_require__(28)('iframe')
+	  var iframe = __webpack_require__(28)('iframe')
-	    , i      = enumBugKeys.length
+	    , i      = enumBugKeys.length
-	    , gt     = '>'
+	    , lt     = '<'
-	    , iframeDocument;
+	    , gt     = '>'
-	  iframe.style.display = 'none';
+	    , iframeDocument;
-	  __webpack_require__(48).appendChild(iframe);
+	  iframe.style.display = 'none';
-	  iframe.src = 'javascript:'; // eslint-disable-line no-script-url
+	  __webpack_require__(48).appendChild(iframe);
-	  // createDict = iframe.contentWindow.Object;
+	  iframe.src = 'javascript:'; // eslint-disable-line no-script-url
-	  // html.removeChild(iframe);
+	  // createDict = iframe.contentWindow.Object;
-	  iframeDocument = iframe.contentWindow.document;
+	  // html.removeChild(iframe);
-	  iframeDocument.open();
+	  iframeDocument = iframe.contentWindow.document;
-	  iframeDocument.write('<script>document.F=Object</script' + gt);
+	  iframeDocument.open();
-	  iframeDocument.close();
+	  iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt);
-	  createDict = iframeDocument.F;
+	  iframeDocument.close();
-	  while(i--)delete createDict[PROTOTYPE][enumBugKeys[i]];
+	  createDict = iframeDocument.F;
-	  return createDict();
+	  while(i--)delete createDict[PROTOTYPE][enumBugKeys[i]];
-	};
+	  return createDict();
-	
+	};
-	module.exports = Object.create || function create(O, Properties){
+	
-	  var result;
+	module.exports = Object.create || function create(O, Properties){
-	  if(O !== null){
+	  var result;
-	    Empty[PROTOTYPE] = anObject(O);
+	  if(O !== null){
-	    result = new Empty;
+	    Empty[PROTOTYPE] = anObject(O);
-	    Empty[PROTOTYPE] = null;
+	    result = new Empty;
-	    // add "__proto__" for Object.getPrototypeOf polyfill
+	    Empty[PROTOTYPE] = null;
-	    result[IE_PROTO] = O;
+	    // add "__proto__" for Object.getPrototypeOf polyfill
-	  } else result = createDict();
+	    result[IE_PROTO] = O;
-	  return Properties === undefined ? result : dPs(result, Properties);
+	  } else result = createDict();
+	  return Properties === undefined ? result : dPs(result, Properties);
 	};
 
+
 /***/ },
 /* 33 */
 /***/ function(module, exports, __webpack_require__) {
 
-	// 19.1.2.7 / 15.2.3.4 Object.getOwnPropertyNames(O)
+	// 19.1.2.7 / 15.2.3.4 Object.getOwnPropertyNames(O)
-	var $keys      = __webpack_require__(35)
+	var $keys      = __webpack_require__(35)
-	  , hiddenKeys = __webpack_require__(16).concat('length', 'prototype');
+	  , hiddenKeys = __webpack_require__(16).concat('length', 'prototype');
-	
+	
-	exports.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O){
+	exports.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O){
-	  return $keys(O, hiddenKeys);
+	  return $keys(O, hiddenKeys);
 	};
 
 /***/ },
@@ -574,22 +576,22 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 35 */
 /***/ function(module, exports, __webpack_require__) {
 
-	var has          = __webpack_require__(2)
+	var has          = __webpack_require__(2)
-	  , toIObject    = __webpack_require__(3)
+	  , toIObject    = __webpack_require__(3)
-	  , arrayIndexOf = __webpack_require__(45)(false)
+	  , arrayIndexOf = __webpack_require__(45)(false)
-	  , IE_PROTO     = __webpack_require__(21)('IE_PROTO');
+	  , IE_PROTO     = __webpack_require__(21)('IE_PROTO');
-	
+	
-	module.exports = function(object, names){
+	module.exports = function(object, names){
-	  var O      = toIObject(object)
+	  var O      = toIObject(object)
-	    , i      = 0
+	    , i      = 0
-	    , result = []
+	    , result = []
-	    , key;
+	    , key;
-	  for(key in O)if(key != IE_PROTO)has(O, key) && result.push(key);
+	  for(key in O)if(key != IE_PROTO)has(O, key) && result.push(key);
-	  // Don't enum bug & hidden keys
+	  // Don't enum bug & hidden keys
-	  while(names.length > i)if(has(O, key = names[i++])){
+	  while(names.length > i)if(has(O, key = names[i++])){
-	    ~arrayIndexOf(result, key) || result.push(key);
+	    ~arrayIndexOf(result, key) || result.push(key);
-	  }
+	  }
-	  return result;
+	  return result;
 	};
 
 /***/ },
@@ -1030,7 +1032,6 @@ return /******/ (function(modules) { // webpackBootstrap
 	        xhr.timeout = this.timeout;
 	      }
 	
-	      xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
 	      for (var key in this.request.headers) {
 	        xhr.setRequestHeader(key, this.request.headers[key]);
 	      }
@@ -1257,14 +1258,14 @@ return /******/ (function(modules) { // webpackBootstrap
 	
 	var _symbol2 = _interopRequireDefault(_symbol);
 	
-	var _typeof = typeof _symbol2.default === "function" && typeof _iterator2.default === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof _symbol2.default === "function" && obj.constructor === _symbol2.default ? "symbol" : typeof obj; };
+	var _typeof = typeof _symbol2.default === "function" && typeof _iterator2.default === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof _symbol2.default === "function" && obj.constructor === _symbol2.default && obj !== _symbol2.default.prototype ? "symbol" : typeof obj; };
 	
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 	
 	exports.default = typeof _symbol2.default === "function" && _typeof(_iterator2.default) === "symbol" ? function (obj) {
 	  return typeof obj === "undefined" ? "undefined" : _typeof(obj);
 	} : function (obj) {
-	  return obj && typeof _symbol2.default === "function" && obj.constructor === _symbol2.default ? "symbol" : typeof obj === "undefined" ? "undefined" : _typeof(obj);
+	  return obj && typeof _symbol2.default === "function" && obj.constructor === _symbol2.default && obj !== _symbol2.default.prototype ? "symbol" : typeof obj === "undefined" ? "undefined" : _typeof(obj);
 	};
 
 /***/ },
@@ -1500,39 +1501,39 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 55 */
 /***/ function(module, exports, __webpack_require__) {
 
-	var dP       = __webpack_require__(6)
+	var dP       = __webpack_require__(6)
-	  , anObject = __webpack_require__(8)
+	  , anObject = __webpack_require__(8)
-	  , getKeys  = __webpack_require__(11);
+	  , getKeys  = __webpack_require__(11);
-	
+	
-	module.exports = __webpack_require__(4) ? Object.defineProperties : function defineProperties(O, Properties){
+	module.exports = __webpack_require__(4) ? Object.defineProperties : function defineProperties(O, Properties){
-	  anObject(O);
+	  anObject(O);
-	  var keys   = getKeys(Properties)
+	  var keys   = getKeys(Properties)
-	    , length = keys.length
+	    , length = keys.length
-	    , i = 0
+	    , i = 0
-	    , P;
+	    , P;
-	  while(length > i)dP.f(O, P = keys[i++], Properties[P]);
+	  while(length > i)dP.f(O, P = keys[i++], Properties[P]);
-	  return O;
+	  return O;
 	};
 
 /***/ },
 /* 56 */
 /***/ function(module, exports, __webpack_require__) {
 
-	var pIE            = __webpack_require__(19)
+	var pIE            = __webpack_require__(19)
-	  , createDesc     = __webpack_require__(12)
+	  , createDesc     = __webpack_require__(12)
-	  , toIObject      = __webpack_require__(3)
+	  , toIObject      = __webpack_require__(3)
-	  , toPrimitive    = __webpack_require__(24)
+	  , toPrimitive    = __webpack_require__(24)
-	  , has            = __webpack_require__(2)
+	  , has            = __webpack_require__(2)
-	  , IE8_DOM_DEFINE = __webpack_require__(30)
+	  , IE8_DOM_DEFINE = __webpack_require__(30)
-	  , gOPD           = Object.getOwnPropertyDescriptor;
+	  , gOPD           = Object.getOwnPropertyDescriptor;
-	
+	
-	exports.f = __webpack_require__(4) ? gOPD : function getOwnPropertyDescriptor(O, P){
+	exports.f = __webpack_require__(4) ? gOPD : function getOwnPropertyDescriptor(O, P){
-	  O = toIObject(O);
+	  O = toIObject(O);
-	  P = toPrimitive(P, true);
+	  P = toPrimitive(P, true);
-	  if(IE8_DOM_DEFINE)try {
+	  if(IE8_DOM_DEFINE)try {
-	    return gOPD(O, P);
+	    return gOPD(O, P);
-	  } catch(e){ /* empty */ }
+	  } catch(e){ /* empty */ }
-	  if(has(O, P))return createDesc(!pIE.f.call(O, P), O[P]);
+	  if(has(O, P))return createDesc(!pIE.f.call(O, P), O[P]);
 	};
 
 /***/ },
@@ -1564,18 +1565,18 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 58 */
 /***/ function(module, exports, __webpack_require__) {
 
-	// 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O)
+	// 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O)
-	var has         = __webpack_require__(2)
+	var has         = __webpack_require__(2)
-	  , toObject    = __webpack_require__(62)
+	  , toObject    = __webpack_require__(62)
-	  , IE_PROTO    = __webpack_require__(21)('IE_PROTO')
+	  , IE_PROTO    = __webpack_require__(21)('IE_PROTO')
-	  , ObjectProto = Object.prototype;
+	  , ObjectProto = Object.prototype;
-	
+	
-	module.exports = Object.getPrototypeOf || function(O){
+	module.exports = Object.getPrototypeOf || function(O){
-	  O = toObject(O);
+	  O = toObject(O);
-	  if(has(O, IE_PROTO))return O[IE_PROTO];
+	  if(has(O, IE_PROTO))return O[IE_PROTO];
-	  if(typeof O.constructor == 'function' && O instanceof O.constructor){
+	  if(typeof O.constructor == 'function' && O instanceof O.constructor){
-	    return O.constructor.prototype;
+	    return O.constructor.prototype;
-	  } return O instanceof Object ? ObjectProto : null;
+	  } return O instanceof Object ? ObjectProto : null;
 	};
 
 /***/ },
@@ -2044,13 +2045,14 @@ return /******/ (function(modules) { // webpackBootstrap
 /* 72 */
 /***/ function(module, exports) {
 
-	module.exports = "\n<label :class=\"{'file-uploads': true, 'file-uploads-html5': $mode == 'html5', 'file-uploads-html4': $mode == 'html4'}\">\n    <span>{{title}}</span>\n    <input-file></input-file>\n</label>\n";
+	module.exports = "\n<label :class=\"{'file-uploads': true, 'file-uploads-html5': $mode == 'html5', 'file-uploads-html4': $mode == 'html4'}\">\n    <span>{{{title}}}</span>\n    <input-file></input-file>\n</label>\n";
 
 /***/ },
 /* 73 */
 /***/ function(module, exports, __webpack_require__) {
 
 	var __vue_script__, __vue_template__
+	var __vue_styles__ = {}
 	__webpack_require__(75)
 	__vue_script__ = __webpack_require__(37)
 	if (__vue_script__ &&
@@ -2060,9 +2062,15 @@ return /******/ (function(modules) { // webpackBootstrap
 	__vue_template__ = __webpack_require__(72)
 	module.exports = __vue_script__ || {}
 	if (module.exports.__esModule) module.exports = module.exports.default
+	var __vue_options__ = typeof module.exports === "function" ? (module.exports.options || (module.exports.options = {})) : module.exports
 	if (__vue_template__) {
-	(typeof module.exports === "function" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__
+	__vue_options__.template = __vue_template__
 	}
+	if (!__vue_options__.computed) __vue_options__.computed = {}
+	Object.keys(__vue_styles__).forEach(function (key) {
+	var module = __vue_styles__[key]
+	__vue_options__.computed[key] = function () { return module }
+	})
 
 
 /***/ },

index.html

@@ -70,7 +70,7 @@
             <tbody>
                 <tr>
                     <td>
-                        <file-upload title="Add upload files" class="file-upload" name="file" post-action="./post.php" put-action="./put.php"  :extensions="extensions" :accept="accept" :multiple="multiple" :size="size" v-ref:upload :drop="drop"></file-upload>
+                        <file-upload title="<strong>Add upload files</strong>" class="file-upload" name="file" post-action="./post.php" put-action="./put.php"  :extensions="extensions" :accept="accept" :multiple="multiple" :size="size" v-ref:upload :drop="drop"></file-upload>
                     </td>
                     <td>
                         <button v-if="upload.active" type="submit" @click.prevent="$refs.upload.active = !$refs.upload.active">Stop upload</button>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "vue-upload-component",
   "description": "Vue.js file upload component, Support for multiple file uploads, progress, html5, html4, support ie9",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "author": "LianYue",
   "scripts": {
     "dev": "webpack-dev-server --inline --hot",

src/FileUpload.vue

@@ -1,6 +1,6 @@
 <template>
     <label :class="{'file-uploads': true, 'file-uploads-html5': $mode == 'html5', 'file-uploads-html4': $mode == 'html4'}">
-        <span>{{title}}</span>
+        <span>{{{title}}}</span>
         <input-file></input-file>
     </label>
 </template>
@@ -478,7 +478,7 @@ export default {
         xhr.timeout = this.timeout;
       }
 
-      xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+      // xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
       for (var key in this.request.headers) {
         xhr.setRequestHeader(key, this.request.headers[key]);
       }