|
@@ -1,90 +1,11 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <router-link to="/p1">page1</router-link><router-link to="/p2">page2</router-link>
|
|
|
- <router-view></router-view>
|
|
|
- <childS :gydxmsg="gydxinfo" @changefathermsg="setgydxmsg" ref="child"></childS>
|
|
|
- <button @click="usechildfun">调用子方法</button>
|
|
|
- <div v-html="myhtml"></div>
|
|
|
- <div >{{ gydxinfo }}</div>
|
|
|
- <el-button type="primary" @click="change">change</el-button>
|
|
|
- <div>当前添加商品信息:{{ fullInfo }}</div>
|
|
|
- <el-row>
|
|
|
- <el-col>
|
|
|
- <el-input type="text" placeholder="商品名称" v-model="addGoodInfo.goodsName"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-select placeholder="商品类型" v-model="addGoodInfo.type">
|
|
|
- <el-option v-for="(item, index) in goodsType" :value="item" :key="index"></el-option>
|
|
|
- </el-select>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-input type="text" placeholder="商品价格" v-model="addGoodInfo.price"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-input type="text" placeholder="商品描述" v-model="addGoodInfo.info"></el-input>
|
|
|
- </el-col>
|
|
|
- <el-col>
|
|
|
- <el-button @click="addGood">添加</el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-table :data="goods">
|
|
|
- <el-table-column prop="goodsName" label="商品名" width="180" />
|
|
|
- <el-table-column prop="price" label="价格" width="180" />
|
|
|
- <el-table-column prop="type" label="类型" />
|
|
|
- <el-table-column prop="info" label="信息" />
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
+ <div></div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import childS from './views/childS'
|
|
|
-export default {
|
|
|
- components:{childS},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- addGoodInfo: {
|
|
|
- goodsName: '',
|
|
|
- price: '',
|
|
|
- type: '',
|
|
|
- info: ''
|
|
|
- },
|
|
|
- goodsType: ['电子', '玩具', '烟酒', '零食'],
|
|
|
-
|
|
|
- goods: [
|
|
|
- { goodsName: '小米手机', price: 1000, type: '电子', info: '第一代' },
|
|
|
- { goodsName: '华为手机', price: 2000, type: '电子', info: '第二代' },
|
|
|
- { goodsName: '苹果手机', price: 3000, type: '电子', info: '第三代' },
|
|
|
- ],
|
|
|
- mytext: 'hhhhhh',
|
|
|
- myhtml: '<a href="http://baidu.com">baidu</a>',
|
|
|
- gydxinfo: '工业大学'
|
|
|
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- usechildfun(){
|
|
|
- this.$refs.child.setmag("hahahaha")
|
|
|
- },
|
|
|
- setgydxmsg(msg){
|
|
|
- this.gydxinfo = msg;
|
|
|
- },
|
|
|
- addGood() {
|
|
|
- this.goods.unshift(this.addGoodInfo)
|
|
|
- },
|
|
|
- change() {
|
|
|
- this.gydxinfo = '长春工业大学'
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- fullInfo() {
|
|
|
- return this.addGoodInfo.goodsName + ' ' + this.addGoodInfo.type + ' ' + this.addGoodInfo.price + ' ' + this.addGoodInfo.info
|
|
|
- },
|
|
|
- },
|
|
|
- watch: {
|
|
|
- gydxinfo(newvalue, oldvalue) {
|
|
|
- console.log(newvalue, '****', oldvalue);
|
|
|
- }
|
|
|
- }
|
|
|
+export default {
|
|
|
+
|
|
|
}
|
|
|
</script>
|
|
|
|